javascript - 测量同级元素的总高度

Question

是否可以测量一组具有相同类的元素的总高度？

我有以下代码:

<ul class="wrapper">
  <li class="row-1">
    <a>This is row 1</a>
  </li>
  <li class="row-1">
    <a>This is row 1</a>
  </li>
  <li class="row-1">
    <a>This is row 1</a>
  </li>
  <li class="row-1">
    <a>This is row 1</a>
  </li>
</ul>

我想知道所有 row-1 元素的组合高度是多少。我无法使用容器的高度，因为其中可能还有其他我不想知道其高度的元素。

Answer 1

试试这个:

var height = Array.from(document.querySelectorAll('.wrapper .row-1')).map(el => el.clientHeight).reduce((a, b) => a + b, 0)