javascript - 收集 div 并对其执行 CSS : HTMLCollection vs Array

Question

想知道如何使它正常工作:

var ArrayTest = [1,2,3,4,"test"];
var ArrayTest2 = document.getElementsByClassName('mydiv');
ArrayTest2.forEach( function(){
    this.style.display = 'none'; 
});

所以 ArrayTest 作为 Array 返回，但是 ArrayTest2 作为 HTMLCollection 返回并且 forEach 抛出“未定义”类型错误。

如何收集一组具有相同类名的元素，然后对每个元素执行相同的 CSS？

Answer 1

我会用稍微不同的方式来做这件事，通过添加一个 CSS 类，并且可能通过使用 jQuery 让您的生活更轻松:

$(".mydiv").addClass("no-display");

然后在你的 CSS 中

.no-display {
    display: none;
}

如果你想分配特定的内联属性，那么你可以使用:

$(".mydiv").css("display", "none");

编辑

好的，对于纯 JavaScript 方法

for (var i = 0; i < ArrayTest2.length; i++) {
   ArrayTest2[i].style.display = "none"; 
}