JS---获取元素计算后的样式属性值 (getComputedStyle)---兼容函数

获取计算后的样式属性----获取一个元素任意一个样式属性值

 

获取元素距离左边位置的值

会有如下兼容性问题：

    my$("btn").onclick = function () {
      //获取元素距离左边位置的值
      console.log(my$("dv").offsetleft);

      //谷歌,火狐支持
      //console.log(window.getcomputedstyle(my$("dv"),null).left);
      //console.log(window.getcomputedstyle(my$("dv"),null)["left"]);

      //ie8支持
      //console.log(my$("dv").currentstyle.left);
    };

 

获取任意一个元素的任意一个样式属性的值

因此封装一个兼容函数，判断浏览器是否支持再返回

//获取任意一个元素的任意一个样式属性的值

　　function getstyle(element, attr) {
      //判断浏览器是否支持这个方法
      return window.getcomputedstyle ? window.getcomputedstyle(element, null)[attr] : element.currentstyle[attr];
    }

 

测试：

    //测试
    my$("btn").onclick = function () {
      console.log(getstyle(my$("dv"), "top"));
    };