DOM Enlightenment Book

by domenlightenment

HTML

<script src="https://getfirebug.com/firebug-lite-debug.js"></script>
<style id="styleElement">
body{background-color:#fff;margin:20px;}
p{line-height:1.4em; color:blue;}
</style>

JavaScript

var sSheet = document.querySelector('#styleElement').sheet;

//array like list containing all of the CSSrule objects repreesenting each CSS rule in the style sheet
console.log(sSheet.cssRules);

console.log(sSheet.cssRules.length); //logs 2

//rules are index in a CSSRules list starting at a 0 index
console.log(sSheet.cssRules[0]); //logs first rule
console.log(sSheet.cssRules[1]); //logs second rule