监听按钮的点击来隐藏元素，结果显示：Cannot read properties of null (reading 'hidden')，什么原因？

作者站长头像
站长
· 阅读数 7

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <button class = "btn">点击隐藏</button> <!-- 全局hidden属性，本质上是浏览器设置display:none --> <div clsss = "box" style = "color:red">我是盒子</div> <script>

//拿到boxEl元素
var boxEl = document.querySelector(".box");
//获取按钮元素
var btnEl = document.querySelector(".btn");
//监听按钮的点击
btnEl.onclick = function() {
  console.log(boxEl.hidden);
}

监听按钮的点击来隐藏元素，结果显示：Cannot read properties of null (reading 'hidden')，什么原因？ </script></body></html>

回复
1个回答
avatar
test
2024-06-30

哥，<div clsss="box" style="color:red">我是盒子</div>

class写成了clsss了，要细心一些喔

回复
likes
适合作为回答的
  • 经过验证的有效解决办法
  • 自己的经验指引，对解决问题有帮助
  • 遵循 Markdown 语法排版，代码语义正确
不该作为回答的
  • 询问内容细节或回复楼层
  • 与题目无关的内容
  • “赞”“顶”“同问”“看手册”“解决了没”等毫无意义的内容