Question

我在我的 html 页面中创建了一个复选框： <input type="checkbox" class="checkbox" name="checkbox"> 我想在复选框被选中时添加类“darkmode”，所以我在 JavaScript 中做了这个：

var checkbox = document.querySelector('intput[name=checkbox]');
checkbox.addEventListener('change',function(){
if(this.checked){
    document.body.classList.add('darkmode');
}
else{
    document.body.classList.remove('darkmode');
}
});

但我收到错误：Uncaught TypeError：无法在 app.js:2 处读取 null 的属性“addEventListener” 有人可以帮我吗？

Answer 1

你有几个问题。

你有一个拼写错误 inptput 应该是 input
您应该寻找 type=checkbox 而不是 name=checkbox
this.checkbox 可能不像您认为的那样工作。您很可能想要 checkbox.checked 而不是 this.checked。

var checkbox = document.querySelector('input[type=checkbox]');
checkbox.addEventListener('change', function() {
  if (checkbox.checked) {
    document.body.classList.add('darkmode');
  } else {
    document.body.classList.remove('darkmode');
  }
});

.darkmode {
  background: black;
}

<input type="checkbox" />

未捕获的类型错误：无法在 app.js:2 处使用复选框读取 null 的属性“addEventListener”

1 个答案: