使用 GetElementsByClassName JavaScript 添加类

Add Class using GetElementsByClassName JavaScript

本文关键字：添加 JavaScript GetElementsByClassName 使用      更新时间：2023-09-26

我正在将jQuery网站转换为vanilla javascript，并就将简单的jQuery行转换为javascript的最佳方法寻求建议。

jQuery $(".div_class").css({ display: 'none' });

任何建议在纯 JavaScript 中仅使用类执行此操作都会非常有帮助。

谢谢

尝试使用 document.getElementsByName 来获取所需的元素，

[].slice.bind(document.getElementsByClassName("div_class"))().forEach(function(itm){
  itm.style.display = "none";
});

并通过将类似数组的对象绑定为slice this值并将其转换为数组并调用它。现在循环访问返回的数组并设置其显示属性。

您也可以直接使用forEach来缩短它，

[].forEach.bind(document.getElementsByClassName("div_class"),function(itm){
  itm.style.display = "none";
})();

选择具有该类名的所有元素：

var allEls = document.getElementsByClassName('div_class');

这返回了一个数组，因此您必须遍历每个元素并将每个display更改为none如下所示：

for(var i=0; i < allEls.length; i++){
   allElls[i].style.display = 'none'
}

请尝试以下行：

var div_class = document.getElementsByClassName('div_class');
for (var div in div_class) {
    div.style.display = 'none';
}

我认为您的困惑是因为document.getElementsByClassName('div_class')返回一个Array......因为我使用了 for..in 循环来迭代前一个数组的每个匹配项。

希望对您有所帮助。

相关文章：