JS [撞墙] document.querySelector("").checked

目标：点击空白处，收起左边样式标籤

方法：尝试点空白处，使input被点击，进而改变样式

 <input type="checkbox" id="side-menu-switch" />  <div class="side-menu">    ...  </div>.side-menu {  /* X轴移动 起始 - 往左 先收起 */  transform: translateX(-100%);  /* 转场效果0.5秒 */  transition: 0.3s all linear;}#side-menu-switch:checked + .side-menu {  transform: translateX(0);}

1. 从DOM元素下手，使HTML标籤内移除 checked="checked"    document    .querySelector("#side-menu-switch")    .removeAttribute("checked");无法移除，因本身 <input type="checkbox" id="side-menu-switch" />并无 checked="checked"

2. 因此尝试点击拉开处，HTML标籤内新增 checked="checked"     document     .querySelector("#side-menu-switch")     .setAttribute("checked", "checked");而后重複动作1. 移除第一次有效，此时<input type="checkbox" id="side-menu-switch" />第二次后无效

3. 因此确认css :checked 除第一次后与 html checked="checked" 无关

得知HTML标籤之checked="checked" 与 CSS #side-menu-switch:checked
无关后

4. How to check if a checkbox is checked using JavaScript?

https://flaviocopes.com/how-to-check-checkbox-checked/
检查css是否正在使用该虚拟Class,但用不到= =

5. Element.remove()

不对= =这是移除整个DOM。

6. 求救XD

把checkbox打开，监听点击后的target，确认内部有checked:true

document.querySelector("#side-menu-switch").addEventListener("click", checkEvent);function checkEvent(e){  console.log(e); // target > checked }

灯愣!!!

allDomArray.forEach(function (item, index) {  item = item.addEventListener("click", changeStatus);});function changeStatus(){ document.querySelector("#side-menu-switch").checked = false;}

注意：

1.监听要使用target

2.查看资料直接用e，非e.target