Question

我正在尝试将同一类的所有元素的高度都设置为与该高度相同的DOM负边距底部。我想要这样做是因为每个标题和字幕都不相同，并且高度会发生变化。

问题是脚本运行，但仅返回一个值，并且对列表的所有margin-bottom:-32px;执行相同的.sticker。

最新，最好的方法是什么？

var stickers = document.getElementsByClassName('sticker');

for (var x = 0; x < stickers.length; x++) {
  var sticker = stickers[x];
  var stickerHeight = sticker.offsetHeight;
  console.log(stickerHeight);
  sticker.style.marginBottom = (-stickerHeight) + 'px';
}

.sticker {
  position: relative;
  padding: 0.4rem;
}

<ul class="single-slider">

  <li>
    <a href="#">
      <div class="sticker">
        <h6>
          <span>Title </span>
          <span>Subtitle</span>
        </h6>
      </div>
      <img src="#" />
    </a>
  </li>

  <li>
    <a href="#">
      <div class="sticker">
        <h6>
          <span>Longer<br/>title </span>
          <span>Subtitle</span>
        </h6>
      </div>
      <img src="#" />
    </a>
  </li>

  <li>
    <a href="#">
      <div class="sticker">
        <h6>
          <span>Longer<br/>longer<br/>Title </span>
          <span>Subtitle</span>
        </h6>
      </div>
      <img src="#" />
    </a>
  </li>

</ul>

遍历getElementsByClass以获得所有offsetHeight

0 个答案: