... <script> //获取元素样式属性值 function getStyle(obj,attr) //obj:元素对象,attr:元素的样式 { if(obj.currentStyle) //针对IE { return obj.currentStyle[attr]; } else { return getComputedStyle(obj,false)[attr]; //针对其他浏览器 } } </script> ...
以上代码解析,使用
alert(obj.currentStyle);
这个代码在IE下运行将弹出:
在chrome下弹出:
可以看到IE下弹出的类型是object,在chrome弹出undefined,所以使用代码
if(obj.currentStyle)
来判断当前运行的是否是IE浏览器,因为object类型的逻辑为true,undefined逻辑值为false。currentStyle为IE独家使用的对象属性。
getComputedStyle则是其他浏览器支持的属性,接受两个参数,第一个为需要获取的元素,第二个可以任意设置。
参考文档:https://developer.mozilla.org/zh-CN/docs/Web/API/Window/getComputedStyle
前面的封装的代码可以简写为:
... <script> //获取元素样式属性值 function getStyle(obj,attr) //obj:元素对象,attr:元素的样式 { return obj.currentStyle?obj.currentStyle[attr]:getComputedStyle(obj)[attr]; } </script> ...