styleSheets

 

This page links to two style sheets. First to the usual js.css which I use throughout all my sites, then to a special style sheet for these test pages. You'll notice that some tags have a different colour than usual.

<link rel="stylesheet" href="../js.css">
<link rel="stylesheet" href="specialstyle.css">

This is element x.

 

Test alert(document.styleSheets.length)
Test alert(document.styleSheets[1].cssRules.length)
Test alert(document.styleSheets[1].rules.length)

In these tests I make sure each browser uses cssRules or rules, whichever array it supports.
Test alert(document.styleSheets[1].{cssrules}[0].selectorText)
Test alert(document.styleSheets[1].cssText)
Test alert(document.styleSheets[1].{cssrules}[0].cssText)
Test alert(document.styleSheets[1].{cssrules}[0].style.cssText)

Test alert(document.styleSheets[1].{cssrules}[0].style.color)
Test alert(document.styleSheets[1].{cssrules}['h2'].style.color)
Test document.styleSheets[1].{cssrules}[0].style.color = '#0000cc'

Test alert(document.styleSheets[1].href)
Test document.styleSheets[1].href = '../js_oud.css'

Test alert(document.styleSheets[1].ownerNode.nodeName)
Test alert(document.styleSheets[1].{cssrules}[1].parentRule)
Test alert(document.styleSheets[1].{cssrules}[1].parentStyleSheet)
Test document.styleSheets[1].disabled = true