javascript - Getting CSS file by ID to manipulate the properties -
i have following snippet overwrites css properties:-
var stylesheet = document.stylesheets[2]; // refers 3rd stylesheet // mozilla if (stylesheet.cssrules) { var cssrule = stylesheet.cssrules; // ... } // ie else { var cssrule = stylesheet.rules; // ... }
this code works, don't fact i'm referencing stylesheet using document.stylesheets[2]
because brittle. so, assigned id
link
tag, hoping can use jquery stylesheet id. however, i'm not sure how cast returned object jquery cssstylesheet
object can assign stylesheet
variable.
// want change this... var stylesheet = document.stylesheets[2]; // [object cssstylesheet] // ... this... var stylesheet = $("link#layout"); // not right because [object object]
any clue? thanks.
update
per @tj's suggestion, after futzing around, think might go title
instead of href
... @ least until find incompatibilities next time. right now, works in ff, ie, safari , chrome.
for (var = 0; < document.stylesheets.length; ++i) { var stylesheet = document.stylesheets[i]; if (document.stylesheets[i].title == "layout-overwrite") { // mozilla if (stylesheet.cssrules) { var cssrule = stylesheet.cssrules; // .. } // ie else { var cssrule = stylesheet.rules; // .. } } }
the object you'll id
link
dom element, not stylesheet.
as far know, there's no way assign name stylesheet , name. instead, you'll need define "marker rule" (unless have nice unique rule can for), loop through style sheet objects, , rule determine you've found right one.
edit: both mdc , msdn there's href
property on cssstylesheet
object / stylesheet
object, better marker rule.
edit 2: , (the href
) seems work in ie, ff, chrome, , opera, although i'm getting duplicate entries specific stylesheet tested with: http://jsbin.com/edaga3/2 (off-topic: note if load stylesheet different origin, browser may prevent access rules.)
Comments
Post a Comment