Javascript：获取子元素的宽度

Question

我有两个叠加的div。

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

内部div的内容总共可以大于其他div。

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

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

当我尝试 $（'＃inner'）。width（）并且内容大于外部时，它将返回外部div的宽度。

我正在使用Chrome。

http://jsfiddle.net/4syEJ/

Answer 1

您可以获得父级的.scrollWidth，这将返回您想要的内容。

document.getElementById('outer').scrollWidth

http://jsfiddle.net/4syEJ/3/

Answer 2

尝试：

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

和

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

Answer 3

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

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

http://jsfiddle.net/4syEJ/2/