javascript获取元素样式

首先看，要获取元素样式的两个函数如下：

1.getComputedStyle(element,pseudoElement)

这个方法是window对象的方法，

element表示要获取样式的元素

pseudoElement表示 伪元素，一般填null

该函数会返回一个 CSSStyleDeclaration对象，这个对象保存着的是当前元素生效样式

style读取的是内联样式，即写在元素style属性上的样式，而getComputedStyle是读取的最终样式，包括内联样式、嵌入样式和外部样式。

但是，这个方法不支持ie9以下的浏览器

2.在ie浏览器中，我们可以使用currentStyle()方法

注意，在这两个方法中，读取到的样式都是只读的不能修改

为了使用方便，现在写一个函数，这个函数可以在任何浏览器中获得元素的样式

（也就是合并上面两个函数）

function getStyle(obj,name) {

if(window.getComputedStyle){  //判断浏览器中是否有这个对象，这个window必须加

return getComputedStyle(obj,null)[name];

}else{

return obj.currentStyle[name];

}

}

说明：

1.obj代表要获取样式的元素

2.name表示要获取的样式名

3.window必须加，因为如果不写的话，getComputedStyle会被当作是一个变量，在ie8及以下的浏览器中，如果这个变量找不到，就会去全局中去找，找不到的话就会报错。如果是对象的话，找不到不会报错，而是显示undefined；

0人点赞

JS学习

作者：我是自由的People
链接：https://www.jianshu.com/p/525f6c06eea4
来源：简书
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。