DHTML Methods
DOM Level 2 Specification.
Inserts a new style rule into the style sheet.
styleSheet.addRule ( sSelector, sStyle [ , iIndex ] )
sSelector |
Required. Selector for the new rule. Single contextual selectors are valid. For example, "DIV P B" is a valid contextual selector. |
sStyle |
Required. Style assignments for this style rule. This style takes the same form as an inline style specification. For example, "color:blue" is a valid style parameter. |
iIndex |
Optional. Location in the rules collection where the new style rule will be added. If an index is not provided, the rule will be added to the end of the collection by default. |
The method returns the index within the style sheet's rules collection of the newly inserted rule. This return value is reserved and must not be used.
The method creates a new style rule for the styleSheet object. The new rule then becomes part of the cascade.
Rules can be added to a disabled styleSheet, but they will not apply to the document until the styleSheet is enabled.
This method is Microsoft's® implementation of the generic insertRule interface provided for in the DOM.
The following example adds a rule to the beginning of the rules collection that will set the color of all bold text appearing in a DIV to blue.
<div>Make <B>HTML</B> dynamic.</DIV>
<script language="JavaScript">
var new_rule;
new_rule = styleSheets [ 0 ] .addRule (
"DIV B", "color:blue", 0 );
</script>
The following example adds two rules to the end of the rules collection. The rules apply the hover and link pseudo-class attributes to all anchors that appear within an H2.
<H2><a href="http://www.microsoft.com/>
Where Do You Want to Go Today?</a></H2>
<script language="JavaScript">
document.styleSheets ( 0 ).addRule (
"H2 A:hover", "color:gold" );
document.styleSheets ( 0 ).addRule (
"H2 A:link", "color:black" );
</script>
styleSheet
removeRule, rules, styleSheets