DOM CSS Rule Object
The CSS Rule object of the StyleSheet object allows you to access and modify the individual rules of a stylesheet. IE and Firefox varies in their implementation of the CSS Rule object, though luckily, the difference is mainly in the syntax:
document.styleSheets.cssRules //access the first
rule in Firefox
document.styleSheets.rules //access the first rule in IE Win
CSS Rule Object
As mentioned, IE and Firefox relies on two different CSS Rule objects to access a stylesheet's rules. Below lists the two objects:
|cssRules||DOM2 based CSS Rule object. Supported in NS/ Firefox.|
|rules||IE's CSS Rule object.
|cssText||Returns the content of a
css rule in its entirety, from the selector to the corresponding CSS
declaration(s). NS/Firefox only. A useful property to
easily search within a rule, by looking at both the selector and
attributes of a rule all at once.
|length||Returns the length of the CSS Rule object (cssRules.length or rules.length), in other words, the number of rules within a stylesheet.|
|parentStyleSheet||Returns the styleSheet object that contains the current rule.|
|selectorText||Read/write property that returns the selector part
of a rule. Setting this property yields unpredictable results in
both Firefox and IE.
|style||The "style" object of the css rule object provides
read/write access to individual attributes defined in the rule,
similar in fashion to the "style" object of inline styles.
DD CSS Library
Free CSS menus and codes to give your site a visual boost.