javascript - jQuery:具有类名称的先前子级

我正在尝试获取ul元素内所有先前子级的高度，该元素的“ a​​ctive”元素具有相同的类名。

HTML示例：

<ul class="board-album">
    <li class="album-item item-left"></li>
    <li class="album-item item-right"></li>
    <li class="album-item item-left"></li>
    <li class="album-item item-right"></li>
    <li class="album-item item-left"></li>
    <li class="album-item item-right"></li>
    <li class="album-item item-left"></li>
    <li class="album-item item-right"></li>
</ul>

因此，我需要先将上一类“ item-left”的孩子的身高减掉，然后再将“ item-right”的孩子的身高减掉。

jQuery示例：

$('.item-left').each( function(){
    $(this).prevAll().outerHeight();
});

我还制作了一个JSFiddle来显示与我的问题类似的内容，但问题是它会包含在li元素内的图像，因此高度会有所不同。

如果有任何不清楚的地方，请告诉我。

例：
最后一个item-left仅应获得具有相同类名且对于item-right相同的每个先前子级的合并高度

最佳答案

如果我对您的理解正确，那么您只想知道其中一列中先前元素的高度，对吗？我是在单击时确定的，不确定这是否是您想要的。您可以将其粘贴在小提琴中，然后单击其中一项。

请记住，它仍然会计算那些绝对定位的元素。

    $('.album-item').click(function(){
        selector = '.'+this.className.match(/item-[A-z]*/)[0]
        height = 0
        $(this).prevAll(selector).each(function(){
            height+=$(this).outerHeight()
            }
        )
        alert(height)
      }
    )