If / Else语句控制台日志记录，但Else块中断代码

Question

我的If语句遇到一个奇怪的问题。

我正在基于onMouseEnter和onMouseLeave更改对象的状态（对/错）。

我可以在代码为真时运行代码，但是在else语句中，如果我输入任何代码，代码就会中断。虽然我能够在else块内进行控制台日志。

这里是the codepen

Answer 1

不检查您的查询选择器

Document方法querySelector（）返回文档中与指定选择器或选择器组匹配的第一个Element。如果没有找到匹配项，则返回null。

let element = document.querySelector('.nav .subnav-block li a ');

if(element)
element.style.color = 'white';

Answer 2

1. 您需要在节点列表中循环并应用样式

    if (isHovered === true) {
    console.log("hovered");
   
    var a = document.querySelectorAll(".nav .subnav-block li a");
   
    console.log(a);
   
    for (i = 0; i < a.length; i++) {
    a[i].style.color = "green";
    }
   // document.querySelector('.nav .subnav-block li a ').style.color = 'green';
   } else {
   console.log("exited");
   // below code will break if uncommented
   
   var a = document.querySelectorAll(".nav .subnav-block li a");
   
   console.log(a);
   
   for (i = 0; i < a.length; i++) {
    a[i].style.color = "white";
   }
   
   // document.querySelectorAll('.nav .subnav-block li a').style.color = "white";
   }