| <html> |
| <head> |
| <style>.one { display: block; } |
| .two { display: inline; } |
| .three { display: list-item; list-style-type: square; margin-left: 3em; } |
| .four { display: none; color: red; } |
| I { display: block; } |
| </style> |
| <script> |
| function test() { |
| if (window.testRunner) |
| testRunner.dumpAsText(); |
| |
| t = document.createTextNode(document.getElementsByTagName('style').item(0).firstChild.nodeValue); |
| document.getElementById('docStyle').appendChild(t); |
| |
| styleSheet = document.styleSheets.item(0) |
| |
| s = "" |
| for (i = 0; i < styleSheet.cssRules.length; i++) { |
| rule = styleSheet.cssRules.item(i); |
| switch (rule.type) { |
| case CSSRule.STYLE_RULE: |
| s += rule.selectorText + ' { '; |
| style = rule.style; |
| for (j = 0; j < style.length; j++) { |
| s += style.item(j) + ': ' + style.getPropertyValue(style.item(j))+ '; '; |
| } |
| s += '}\n'; |
| } |
| } |
| |
| document.getElementById('serializedStyle').appendChild(document.createTextNode(s)); |
| } |
| </script> |
| </head> |
| <body onload="test();"> |
| <div>Style as specified in the style element:</div> |
| <pre id="docStyle"></pre> |
| <div>Serialized style, using CSS DOM:</div> |
| <pre id="serializedStyle"></pre> |
| </body> |
| </html> |