首页 > 技术文章 > currentStyle与getComputedStyle应用

Faith-zhang 2017-01-04 23:50 原文

  • getComputedStyle获取的是计算机(浏览器)计算后的样式,但是不兼容IE6、7、8(主要用于非IE浏览器)
  • currentStyle方法兼容IE6、7、8,但是不兼容标准浏览器(主要用于IE浏览器)

  属性判断法、版本检测法来解决浏览器间的兼容性问题

  ~~~ js

      function getStyle( obj, attr) {

        return obj.currentStyle ? obj.currentStyle[attr]:getComputedStyle( obj )[attr];

      }

  ~~~

注意事项:

  • 如果用以上的方法获取某个元素的复合样式,例如background,那么就不要用上面那种方式获取,在不同浏览器间有兼容性问题。用上面的方法获得单一样式,而不要用来获取复合样式。
  • 使用以上方法,注意不要多按空格
  • 使用以上方法,不要获取未设置后的样式,因为浏览器间不兼容
  • 在火狐4.0之前,有个bug,如果getComputedStyle后面不跟参数,会出现问题,所以有些人写成getComputedStyle(obj, false),那个false就是为了解决这个bug。这里的bug也可以写成0,或者其他任何参数都可以。不过目前火狐的浏览器都比较高,因此这个问题已经不是很常见了。
    1 //用法实例  document.all是IE 4.0及以上版本的专有属性,是一个表示当前文档的所有对象的娄组,不仅包括页面上可见的实体对象,还包括一些不可见的对象,比如html注释等等。
    2 if(document.all){
    3     top = divs.currentStyle.top;
    4 }else{
    5     top2 = window.getComputedStyle(divs,null).top;
    6 }

     

     

推荐阅读