首页 > 代码库 > 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