美文网首页
getComputedStyle兼容

getComputedStyle兼容

作者: 前端历险记 | 来源:发表于2016-05-12 14:43 被阅读215次

    兼容处理代码

        if (typeof window.getComputedStyle !== "function") {
            window.getComputedStyle = function(el, pseudo) {
              var oStyle = {};
              var oCurrentStyle = el.currentStyle || {};
              for (var key in oCurrentStyle) {
                oStyle[key] = oCurrentStyle[key];
              }
               
              oStyle.styleFloat = oStyle.cssFloat;
               
              oStyle.getPropertyValue = function(prop) {
                //if (prop == 'float') prop = 'styleFloat';
                return oCurrentStyle.getAttribute(prop) || null;  // IE6 do not support "key-key" but "keyKey"
                /*var re = /(\-([a-z]){1})/g;
                if (prop == 'float') prop = 'styleFloat';
                if (re.test(prop)) {
                  prop = prop.replace(re, function () {
                    return arguments[2].toUpperCase();
                  });
                }
                return el.currentStyle[prop] ? el.currentStyle[prop] : null;*/
              };
              return oStyle;
            };
        }
    

    其中oStyle.styleFloat = oStyle.cssFloat;
    styleFloat属性为ie特有,当给元素float:left;
    测试获取,得到结果如下:

    // ie8+,chrome :left
    getComputedStyle(ele,null).getPropertyValue('float')
    
    // chrome,ie9+返回空 ie8返回null
    getComputedStyle(ele, null).getPropertyValue('cssFloat')
    
    // ie+chrome返回:left, ie8返回undefined
    getComputedStyle(ele, null).cssFloat

    相关文章

      网友评论

          本文标题:getComputedStyle兼容

          本文链接:https://www.haomeiwen.com/subject/obhprttx.html