点击按钮无法显示列表：JavaScript代码报错求助

核心错误及修正 #

• 拼写错误：报错的直接原因是addEventListner拼写错误，正确写法是addEventListener（注意单词是Listener，不是Listner）。
• 循环条件错误：nike是对象，没有length属性，循环应该基于nike.departments.length来遍历数组。
• 重复点击问题（可选优化）：每次点击按钮都会重复添加列表项，建议先清空<ul>的内容再重新生成。

修改后的完整代码 #

let nike = {
  "location": "oregon", 
  "industry": "sportswear", 
  "departments": ["finance", "human resources", "operations"]
}

let nikeDept = document.getElementById("nikeDeptBtn");
// 修正拼写错误
nikeDept.addEventListener("click", () => {
  let myUl = document.querySelector("ul");
  // 清空原有内容，避免重复添加
  myUl.innerHTML = "";
  // 修正循环条件，基于departments数组的长度
  for (let i = 0; i < nike.departments.length; i++){
    let li = document.createElement("li");
    li.textContent = nike.departments[i];
    myUl.appendChild(li);
  }
})

额外注意事项 #

确保HTML中存在id为nikeDeptBtn的按钮元素，以及对应的<ul>标签，否则document.getElementById和document.querySelector会返回null，也会导致类似错误。

内容的提问来源于stack exchange，提问作者cjburn