javascript 获取 CSS 样式表属性

最近遇到js获取样式表属性的问题，网上找了很久没有找到，今天看到这样两个属性 currentStyle、defaultView，这两个属性从字面上看，是获取CSS 属性的，而我之前获取css属性用的则是dom.element.style.display 类似这样的写法，今天看到上面提到的两个属性，在网上查了一下，这个两用法是区别的：

dom.element.style.height 对于样式写在<style type="text/css"></style>或者.css文件里，是无效的

与是currentSytle、defaultView就产生了，currentStyle 是IE提供的，defaultView 则于标准浏览器提供的

实例：

<script type="text/javascript">
//document.defaultView.getComputedStyle 这是w3c标准方法，取得元素的样式信息，因为有些样式是在外部css文件定义的，所以用element.style是取不到的
//如果是IE,可以用 element.currentStyle["name"]
   function GetCurrentStyle (obj, prop)
   {
      if (obj.currentStyle) //IE
      {
          return obj.currentStyle[prop];
      }
      else if (window.getComputedStyle) //非IE
      {
          propprop = prop.replace (/([A-Z])/g, "-$1");
          propprop = prop.toLowerCase ();
          return document.defaultView.getComputedStyle(obj,null)[propprop];
      }
      return null;
   }
   var dd=document.getElementById("qq");
   alert(GetCurrentStyle(dd,"color"));
</script>

外部样式,JS函数获取：

var getCss = function(o,key){
    return o.currentStyle ? o.currentStyle[key] : document.defaultView.getComputedStyle(o,false)[key];
};

var domlist = document.getElementsByClassName('menulist');

for( var i=0;i < domlist.length ;i++){

    console.log(getCss(domlist[i],'display'));
    
}

转载于:https://www.cnblogs.com/richardcastle/p/8296970.html