javascript - classList.add(未捕获的类型错误 : Cannot read property 'add' of undefined)

标签 javascript css class

为什么这不起作用?

const desktop = document.getElementsByClassName("desktop");
const enableDarkMode = () => {
    desktop.classList.add('night_mode');
}

在控制台中显示“未捕获类型错误:无法读取未定义的属性‘add’”。 我该如何修复它?

最佳答案

getElementsByClassName 返回一个集合,而不是单个元素。因此,您需要迭代节点列表并应用该类。

示例:

const divs = document.getElementsByClassName("desktop");
for (let i = 0; i < divs.length; i++) {
  const div = divs[i];
  div.classList.add('night_mode');
}
.night_mode {
  background: black;
  color: white;
}
<div class="desktop">Desktop</div>
<div class="desktop">Desktop</div>
<div class="desktop">Desktop</div>
<div class="desktop">Desktop</div>
<div class="desktop">Desktop</div>
<div class="desktop">Desktop</div>

关于javascript - classList.add(未捕获的类型错误 : Cannot read property 'add' of undefined),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60122152/

相关文章:

javascript - 带有循环的 jQuery 中的 setTimeout

javascript - Highstock 源代码中的奇怪字符

jquery - 背景居中时模糊 div 标签后面的内容

class - 您如何根据您使用的方法命名一个既加密又解密的组件?

javascript - eslint 禁用扩展覆盖

javascript - 从 HTML 中检索 <p> 的值并在 Javascript 中转换为数字

javascript - 如何依次转到特定页面.js

css - 均匀分布的网格动态内容

c++ - 尝试实例化新对象时出错

java - 在 JDBC 中使用 class.forName