Click to return to the DHTML, HTML     
rows Collection     scripts Collection     DHTML Collections    
Web Workshop  |  DHTML, HTML & CSS

rules Collection


Retrieves a collection of rules defined in the style sheet.

Syntax

[ collRules = ] stylesheet.rules
[ oObject = ] stylesheet.rules(iIndex)

Possible Values

collRules Array of rules.
oObject Reference to an individual item in the array of elements contained by the object.
iIndex Required. Integer that specifies the zero-based index of the item to be returned.

Members

Remarks

This collection is always accessible, even if the style sheet is not enabled. Rules are added to the rules collection with the addRule method on the individual style sheet. A rule that is added to a disabled style sheet does not apply to the document unless the style sheet is enabled. Rules are deleted with the removeRule method.

The rules in this collection are in the source order of the document. As rules are added or deleted through the cascading style sheets (CSS) Object Model, a rule's absolute position in the rules collection might change, but its position relative to other rules remains the same. When you add rules without specifying an index, the rule gets added to the document last. If you specify an index, however, the rule is inserted before the rule currently in that ordinal position in the collection. If the specified index is greater than the number of rules in the collection, the rule is added to the end.

Example

This example shows how to use the rules collection to identify the color specified in style sheet rules.

Sample Code

<HTML>
<HEAD>
<SCRIPT>
function ruleColor(ruleIndex) {
    alert("The color of rule " + ruleIndex + " is " +
        document.styleSheets[0].rules.item(ruleIndex).style.color + ".");
}
</SCRIPT>

<STYLE>
.rule0 {color:"red"}
.rule1 {color:"blue"} 
</STYLE>
</HEAD>

<BODY>
<P class="rule0" id="oRule0Span">
    Rule 0 is applied to this line.
</P>
<P class="rule1" id="oRule1Span">
    Rule 1 is applied to this line.
</P>

<BUTTON onclick="ruleColor(0)">Color of Rule 0</BUTTON> 
<BUTTON onclick="ruleColor(1)">Color of Rule 1</BUTTON>

</BODY>
</HTML>

This feature requires Internet Explorer 4.0 or later. Click the icon below to install the latest version. Then reload this page to view the sample.
Microsoft Internet Explorer

Applies To

[ Object Name ]
PlatformVersion
Win16:
Win32:
Mac:
Unix:
WinCE:

styleSheet



Back to topBack to top

Did you find this topic useful? Suggestions for other topics? Write us!

© 1999 Microsoft Corporation. All rights reserved. Terms of use.