【读书笔记】DOM2级中关于几种CSS实例的理解

之前对DOM2里CSS规则这个概念总是一知半解,几种CSS类型也傻傻分不清:CSSStyleDeclaration类型,CSSStyleSheet类型,CSSRule类型,现在自己总结一下。

1、CSSStyleDeclaration 表示一个CSS属性键值对的集合。元素的style属性只有行内样式的信息,是CSSStyleDeclaration的实例,不包含嵌入样式和外联样式

如:div.style.width = 100px; 


2、通过document.defautView.getComputedStyle()方法得到的同样是CSSStyleDeclaration实例。

3、CSSStyleSheets类型,表示样式表,其中最重要一属性为cssRules(IE不支持,有一类似的rules属性),表示样式表中包含的样式规则的集合。

得到CSSStyleSheets类型的方法:document.styleSheets。

首先取得样式表,即CSSStyleSheets类型: var sheets = document.styleSheets;

取得第一个样式表: var sheet  = sheets[0]; (或sheets.item(0))
获取样式规则,CSSStyleRules类型,继承了CSSRule类: var rules = sheet.cssRules || sheet.rules;

第一条规则: var rule = rules[0];


我的理解是,通俗易懂的说CSSRule对象就是我们CSS代码中的一段如:

 .myclass {

background: #EFC url('someurl') no-repeat;

}

以上整个代码就是一个CSSRule对象,表示一条CSS规则。


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值