将类名应用于Html节点数组

Question

我正在尝试将类应用于HTML节点数组，如：

 var divRelatedBox = document.getElementsByClassName('related-box');
 divRelatedBox.classList.toggle('hide')

但它不起作用......

我做错了什么？

Answer 1

您可能会对jQuery感到困惑。与jQuery对象相反，您不能直接在HTMLElement上应用HTMLCollection方法，并将其应用于列表中的每个元素。您必须遍历列表并逐个应用您的方法。

var divRelatedBox = document.getElementsByClassName('related-box');

for (var i = 0; i < divRelatedBox.length; i++) {
    divRelatedBox[i].classList.toggle('hide');
}

或使用Array.prototype.forEach，我觉得更干净：

Array.prototype.forEach.call(divRelatedBox, function (element) {
    element.classList.toggle('hide');
});