Javascript 无法获取未定义或空引用的属性“textContent”

我正在尝试将menuSelected.textContent（我唯一的h4）更改为我从菜单中选择的选项的textContent。我犯了这个错误，我想知道我做错了什么。你们能帮帮我吗？多谢各位

我已尝试设置menuSelected.textContent=菜单[0]。在循环之前设置textContent，但当我单击其他菜单[1]、菜单[2]等时，它不会改变

var menu = document.querySelectorAll(".menu a");
var menuSelected = document.querySelector("h4");

//menu controls

for(var i = 0; i < menu.length; i++){
    menu[i].addEventListener("click", function(){
        menuSelected.textContent = menu[i].textContent;
    });
}

控制台显示此错误：

0:无法获取未定义或空引用的属性“textContent”

---

我想问题在于您用来为菜单元素生成单击侦听器的for循环

for(var i = 0; i < menu.length; i++){
    menu[i].addEventListener("click", function(){
        menuSelected.textContent = menu[i].textContent;
    });

}

i是一个局部变量，在click events回调函数中不可用。实际上是这样，但它保留了在for循环中递增后的最后一个值，该值始终是数组长度。所以，如果您尝试访问menu[i].textContent，它将尝试访问数组边界之外的元素

您需要为函数指定一个特殊的e参数，该参数保存事件和触发事件的对象：

for(var i = 0; i < menu.length; i++){

    menu[i].addEventListener("click", function(e){
        menuSelected.textContent = e.target.textContent;
    });
}

---

哇，这真的管用。我有点理解为什么，但我不是100%确定。我会查清楚这个“e”参数的确切含义。谢谢！！！！很高兴我能帮助Guilherme！这里有一个很好的解释：我知道了。非常感谢你们的帮助，我很感激。我也爱上了它。