currentStyle与getComputedStyle应用

fwxstar 2018-06-29 606次浏览

摘要:  function $( v ){      if( typeof v === &...


 function $( v ){
     if( typeof v === 'function' ){
         window.onload = v;
     } else if ( typeof v === 'string' ) {
         return document.getElementById(v);
     } else if ( typeof v === 'object' ) {
         return v;
     }
 }



$("one").onclick = function () {
    //alert(this.style.width); //只能获取写在行内样式的css
    //alert(getComputedStyle(this).width); // 获取计算器(浏览器计算过后的样式)  ie6,7,8不支持
    //alert(this.currentStyle.width); // 获取计算器(浏览器计算过后的样式) 标准浏览器不支持

    //可以检测浏览器是否是ie6,7,8
    if( $('div1').currentStyle ){
        alert( $('div1').currentStyle.width );
    } else {
        alert( getComputedStyle( $('div1'), 0 ).width );
        // FF 4.0 之前 getComputedStyle 后面的参数针对火狐老版本,参数随意
    }

    alert(getStyle(this,"width"));
    alert(getStyle(this,"background")); //变现不一致

    //background:url()  red ..... 复合样式(不要获取)
    //backgroundColor             单一样式(不要拿来做判断)
    //不要获取未设置的样式

};
 function getStyle(obj,attr){
     return obj.currentStyle? obj.currentStyle[attr] : getComputedStyle(obj)[attr];
 }