Question

我正在尝试计算元素的宽度，这样当我使用JavaScript将父元素包裹起来时，我可以设置父元素的宽度以匹配子元素的宽度。显而易见的$('#element').css('width');并不是我想要的，因为它似乎只返回计算出的像素值。有什么方法可以返回实际的CSS值，无论是300px还是20%还是auto，而不是计算值？

以下是一般设置方式，但我想知道#child的CSS值而非计算值。

$(document).ready(function(){
    $('#child').wrap('<div id="parent"></div>');
    $('#parent').each(function(){
        var childWidth = $(this).children('#child').css('width');
        $(this).css('width', childWidth)
    });
});

Answer 1

我不相信你能做到这一点。你将得到的最好的是offsetWidth或clientWidth返回计算值，包括和不计算边距，填充和边框。

Answer 2

您需要阅读样式表本身。

请参阅：How can I read out the CSS text via Javascript as defined in the stylesheet?

Answer 3

IE以外的所有人都支持window.getComputedStyle(element)，您可以这样使用：

getComputedStyle($('#child')).width; // returns actual width of #child

但是对IE没有帮助。

如何使用Javascript获取CSS宽度值？

3 个答案: