javascript之DOM技术（二）
2010-09-14 13:06:48 来源：WEB开发网这里使用了我在《javascript事件模型框架》中摘记的JS文件。实现可折叠区域的道理与此相同，很常用的功能，不再细说。
4.访问样式表，因为style对象只能访问一个元素的CSS样式，而对于<style/>定义的或者外部CSS文件定义的CSS规则没办法访问，这就引出了如何访问样式表的问题。我们可以通过下面的方式访问：
var cssRules=document.styleSheets[0].cssRules||document.styleSheets[0].rules;
document.styleSheets返回页面上所有样式表的引用，标准DOM中规定每个样式表的规则集合叫cssRules，而IE中叫rules，所以我们用上面的表达式来处理浏览器兼容问题。一个访问的例子：
<html>
<head>
<title>Accessing Style Sheets Example</title>
<style type="text/css">
div.special {
background-color: red;
height: 10px;
width: 10px;
margin: 10px;
}
</style>
<script type="text/javascript">
function changeBackgroundColor() {
var oCSSRules = document.styleSheets[0].cssRules || document.styleSheets[0].rules;
oCSSRules[0].style.backgroundColor = "blue";
}
</script>
</head>
<body>
<div id="div1" class="special"></div>
<div id="div2" class="special"></div>
<div id="div3" class="special"></div>
<input type="button" value="Change Background Color" onclick="changeBackgroundColor()" />
</body>
</html>
Tags：javascript DOM 技术
编辑录入：爽爽 [复制链接] [打 印]
中查找“javascript之DOM技术（二）”更多相关内容
中查找“javascript之DOM技术（二）”更多相关内容更多精彩
赞助商链接
