Javascript：获取子元素的宽度答案

【问题标题】：Javascript: Getting the width of child-elementsJavascript：获取子元素的宽度
【发布时间】：2013-02-11 01:37:53
【问题描述】：

我有两个堆叠的 div。

外部 div 的宽度固定，溢出隐藏。

内部 div 的内容总和可以大于外部 div。

如何获取内部div内容的总宽度？

<div id='outer' style='width:100px'>
    <div id='inner'>
        content
    </div>
</div>

当我尝试 $('#inner').width() 并且内容大于外部时，它将返回外部div的宽度。

我正在使用 Chrome。

【问题讨论】：

【解决方案1】：

你可以得到父级的.scrollWidth，它会返回你想要的。

document.getElementById('outer').scrollWidth

【讨论】：

【解决方案2】：

试试：

<div id="outer" style="width:100px">
    <div id="inner">
        <p id="content">content</p>
    </div>
</div>

和

$('#content').width();

【讨论】：

【解决方案3】：

你可以像这样使用.children() jquery 选择器：

$('#info').html($('#box1').children().width(); 
$('#box2').children().width(); 
$('#box3').width());

【讨论】：