如何使用jQuery获取div内部内容的宽度？

Question

我有一个div，左边有一堆图像。我想获得所有图像的集体宽度。我知道我可以抓住div的宽度，因为它扩展到适合它的内容但是我怎么能通过计算内部内容的宽度来实现呢？

修改

对不起，这是标记：

   <div id="gallery">

        <ul>
           <li><img src="images/a.png" /></li>
           <li><img src="images/b.png" /></li>
           <li><img src="images/c.png" /></li>
        </ul>

    </div>

我需要得到所有lis组合的宽度。

Answer 1

试试这个

var totalWidth = 0;
$('#gallery li').each(function(){
    totalWidth  += $(this).outerWidth(true);
});

totalWidth将为您提供width

内所有li的合并div#gallery

Answer 2

我对此不太确定，因为我还没有对它进行过多次测试。 有两个属性scrollWidth和scrollHeight返回＆＃34;元素内容的宽度/高度（以像素为单位）或元素本身的宽度/高度，以较大者为准。

这是vanilla JS，但你可以像jQuery一样使用它：

var totalWidth = $('#gallery').get(0).scrollWidth;

它对我有用。但我没有经过多少考验。

Answer 3

有innerWidth()功能。我们需要查看您的HTML以进一步提供建议。

Answer 4

您可以尝试这样的事情：

    var sumWidth = 0;
    $('selector').each(function(){
        var sumWidth += $(this).width();
    });
    alert('the width sum is: '+sumWidth);

希望它有所帮助！