如何使用document.getElementsByClassName直接更改JS中的样式属性（＆＃34; Class_Name＆＃34;）

Question

我想在JavaScript中使用类名更改CSS属性背景颜色。我的代码如下

function changeColor(){
    document.getElementsByClassName("flex-items").style.backgroundColor = "blue";
}

使用按钮的onclick事件调用函数changeColor（）。

<button onclick="changeColor()">Change Color</button> 

这个问题有解决方法吗？

[注意有许多div类，其中包含类名＆＃34; flex-items＆＃34;我只想点击一下即可更改所有背景颜色。]

Answer 1

将它们推入数组并循环完成。

window.changeBG = function() { 
    var items = document.getElementsByClassName('item');
    for(var i in items) items[i].style.backgroundColor = 'red'; 
}

https://jsfiddle.net/gugalondon/69syLdg1/