首页 > 代码库 > JS中currentStyle和getComputedStyle
JS中currentStyle和getComputedStyle
一.在js中经常会获取元素的css样式,方法有很多种,这次只介绍currentStyle和getComputedStyle
1.obj.style这个方法只能获取在HTML中写的行间样式,内联样式不能获取,更别说外联样式了。
2.IE中使用的是obj.currentStyle方法,而firefox中使用的是getComputedStyle方法
“DOM2级样式”增强了document.defaultView,提供了getComputedStyle()方法,这个方法接受两个参数,要取得计算样式的元素和一个伪元素字符串(例如:":after")。如锅不需要伪类元素信息,第二个参数可以设置成false。getComputedStyle()方法可以返回一个CSSStyleDeclaration对象,其中包含当前元素的所有计算的样式。
边框属性可能不会返回样式表中的实际的border规则,是因为不同浏览器解释综合属性的方式不同,因为设置这种属性实际上会涉及很多其他的属性,getComputedStyle.border不会在所有浏览器中都有返回值,但是getComputedStyle.borderLeftWidth则会有返回值。有些返回值会不同,firefox和safari会将所有颜色装换成rgb格式,其他不明。
IE不支持这个属性,不过有个类似的属性为currentStyle属性,这个为属性,为style的属性,是CSSStyleDeclaration的实例,包含当前元素全部计算后的样式。IE也不可以返回综合属性的值。
3.getComputedStyle()为方法,currentStyle为style属性。
1 function getStyle(obj,name) {2 if(obj.currentStyle){3 return obj.currentStyle[name]; 4 } 5 else{6 return getComputedStyle(obj,false)[name]; 7 } 8 }
JS中currentStyle和getComputedStyle