javascript - 如何定位数组中的所有索引号而不是一个？

Question

我有一行 Javascript，意思是找到所有具有“OldClassName”类的 HTML 元素，并用“NewClassName”替换它们的类，但是由于索引 [0]，这行代码只替换了结果数组中的第一个实例。我将如何一次替换“OldClassName”的所有实例？

document.getElementsByClassName("OldClassName")[0].className = "NewClassName";

Answer 1

您可以使用 querySelectorAll并循环遍历每个选定的元素并更改如下所示的类。

如果你想添加使用 ele.classList.add(<classname>)和类似 ele.classList.remove(<classname>)删除一个。

(这个用 new 替换了所有的类名)

const elements = document.querySelectorAll(".old")
elements.forEach(ele => {
  ele.classList = "new"
})

.old {
  background: red;
}

.new {
  background: blue;
}

<div class="old">1</div>
<div class="old">2</div>
<div class="old">3</div>
<div class="old">4</div>
<div class="old">5</div>

希望这可以帮助 !