style-sheet-interfaces-002.html (1655B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>CSS Test: CSSOM StyleSheet Modify Rule List</title> 5 <link rel="author" title="Bear Travis" href="mailto:betravis@adobe.com"> 6 <link rel="reviewer" title="Ms2ger" href="mailto:ms2ger@gmail.com"> <!-- 2012-06-17 --> 7 <link rel="help" href="http://www.w3.org/TR/cssom-1/#the-cssstylesheet-interface"> 8 <link rel="help" href="http://www.w3.org/TR/cssom-1/#the-cssrule-interface"> 9 <meta name="flags" content="dom"> 10 <meta name="assert" content="StyleSheet and CSSStyleSheet objects have the properties specified in their interfaces"> 11 <script src="/resources/testharness.js" type="text/javascript"></script> 12 <script src="/resources/testharnessreport.js" type="text/javascript"></script> 13 <style id="styleElement" type="text/css" media="all" title="internal style sheet" disabled="disabled"> 14 * { margin: 0; padding: 0; } 15 </style> 16 </head> 17 <body> 18 <noscript>Test not run - javascript required.</noscript> 19 <div id="log"></div> 20 <script type="text/javascript"> 21 var sheet = document.getElementById("styleElement").sheet; 22 // Initial rule list is of size 1 23 // Can add a rule at first index 24 test(function() { 25 assert_equals(sheet.cssRules.length, 1); 26 sheet.insertRule("p { color: green; }", 0); 27 assert_equals(sheet.cssRules.length, 2); 28 assert_equals(sheet.cssRules.item(0).cssText, "p { color: green; }"); 29 }, "add_rule"); 30 31 // Can delete rules until rule list is empty 32 test(function() { 33 sheet.deleteRule(0); 34 assert_equals(sheet.cssRules.length, 1); 35 sheet.deleteRule(0); 36 assert_equals(sheet.cssRules.length, 0); 37 }, "delete_rule"); 38 </script> 39 </body> 40 </html>