按钮点击后class未变,主因是事件未绑定或被默认行为干扰;需检查元素是否存在、脚本执行时机、按钮type属性、pointer-events及事件委托使用是否正确。

按钮点击后 class 没变,不是 JS 写错了,大概率是事件根本没绑上,或绑上了但被默认行为冲掉了。
检查 addEventListener 是否真的生效
很多人写完 document.querySelector('.toggle-btn').addEventListener('click', toggle) 就以为万事大吉,但控制台里 document.querySelector('.toggle-btn') 返回 null,说明选择器压根没捞到元素。
- 用开发者工具 Elements 面板确认按钮真实存在,且 class 名完全一致(比如是
toggle-btn还是toggleBtn?有无空格、连字符?) - 脚本是否放在
前端入门到VUE实战笔记:立即使用
在学习笔记中,你将探索 前端 的入门与实战技巧!











