标签：
CSS样式分为三种，行内样式、内部样式、外部样式。
一、element.style.stylename
创建、获取、修改 行内样式
console.log(document.getElementById("testcss0").style.backgroundColor);//""
document.getElementById("testcss0").style.backgroundColor = "black";
console.log(document.getElementById("testcss0").style.backgroundColor);//"black"
二、element.currentStyle 和 element.getComputedStyle
获取 非行内样式
三、element.styleSheets[i].rules[j].style.stylename 和 element.styleSheets[i].cssRules[j].style.stylename
创建、获取、修改 非行内样式
document.styleSheets[i].rules[j].selectorText //selectorText 属性 获取选择器，例如这里是“#testcss0”
<!DOCTYPE HTML> <html> <head> <meta charset=utf-8" /> <link type="text/css" rel="stylesheet" href="test.css" /> <style type="text/css"> #testcss1{ width: 200px; height: 200px; border: 1px solid black; } </style> </head> <body> <div id="testcss0"></div> <div id="testcss1"></div> </div> <script>
//IE //document.styleSheets[0].rules[0].style.width = "100px"; //document.styleSheets[1].rules[0].style.width = "100px"; //var selectorText = document.styleSheets[0].rules[0].selectorText; //selectorText获取选择器，例如这里是“#testcss0”
//firefox document.styleSheets[1].cssRules[0].style.width = "100px"; document.styleSheets[1].cssRules[0].style.backgroundColor = "yellow"; console.log( document.styleSheets[1].cssRules[0].style.width); //"100px" var selectorText = document.styleSheets[1].cssRules[0].selectorText; console.log(selectorText); //"#testcss1"
</script>
</body>
</html>
标签：
原文地址：http://www.cnblogs.com/babywhale/p/4603465.html
