修改/更新HTML

Question

如何在JavaScript中修改/更新具有唯一类名的元素？

以下代码无效：

document.getElementsByClassName("test").style.backgroundColor = "blue";

HTML标记：

<div class="test"></div>
<div class="test"></div>
<div class="test"></div>

Answer 1

getElementsByClassName返回一个类似数组的对象，所以你必须拔出单个元素，或者遍历整个事物！

var elements = document.getElementsByClassName("test");
for(var i = 0; i < elements.length; i++) {
  elements[i].style.backgroundColor = "blue";
}

Answer 2

请参阅：https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementsByClassName

getElementsByClassName()返回一个HTMLCollection，因此您需要指定哪些匹配元素将应用该样式。

演示：https://jsfiddle.net/jnu44ck0/