Question

我需要获得元素的级联样式值（不是计算的值），或者确定是否计算了实际值。

例如，如果我有一个带有css规则width: 100%的元素，我想得到值100%而不是实际的像素值，或者只是想知道实际值是在计算的。< / p>

我知道我可以使用elem.currentStyle获取它，而且我还在Chrome中找到了一种使用document.defaultView.getMatchedCSSRules()找到它的方法。

有没有人知道在其他浏览器中获取它的方法？

Answer 1

如何自己计算价值？查询所需元素的计算宽度和父元素的计算宽度，然后进行一些数学运算得到百分比值？ percentageValue = 100% * widthOfWanted / widthOfContainer

Answer 2

此时我认为在IE以外的浏览器中没有内置的方法：getComputedStyle总是只返回这些属性的使用值，就像你说的那样。

Answer 3

//此示例中的css参数必须是css样式的字符串，而不是camelCase字符串。

function deepCss(who, css, ps){
    var sty, dv= document.defaultView;
    // IE8 and below
    if(document.body.currentStyle){
        sty= css.replace( /\-([a-z])/g, function(a, b){
            return b.toUpperCase();
        });
        return who.currentStyle[sty];
    }
    // everyone else
    if(dv){
        dv= document.defaultView.getComputedStyle(who, ps);
        return dv.getPropertyValue(css);
    }
    return '';
}

deepCss（document.body，'background-color'）

Answer 4

最佳路线是使用与浏览器无关的api库，如jQuery

$(element).css('width') // jquery has a single function that returns a consistent value no matter which browser is in use.

如何获取级联样式值或确定是否计算实际值？

4 个答案: