getElementsByTagName获取按钮后parentNode为undefined问题求助

嘿，这个问题的核心原因其实很容易被忽略——你用的document.getElementsByTagName("button")返回的不是单个按钮元素，而是一个HTMLCollection（类数组的元素集合），哪怕页面里只有一个按钮，它也是包含这个按钮的集合对象，而不是直接的DOM元素。

你在调试器里看到的“btn确实是元素”，应该是展开集合后看到了里面的按钮元素，这个元素确实有parentNode，但你代码里的btn变量本身是集合，集合对象并没有parentNode属性，所以par就会是undefined。

修正方案 #

你只需要从集合中取出对应的元素，或者换用更直接的选择器：

方案1：从HTMLCollection中获取第一个元素

removeBtn() { 
  let btn = document.getElementsByTagName("button")[0]; // 取集合的第一个元素
  let par = btn.parentNode; 
  alert(par); 
}

方案2：使用document.querySelector（更推荐）

querySelector会直接返回匹配到的第一个DOM元素，不用处理集合：

removeBtn() { 
  let btn = document.querySelector("button");
  let par = btn.parentNode; 
  alert(par); 
}

如果之后页面可能有多个按钮，你还可以用querySelectorAll获取所有按钮，再通过索引遍历，但就你当前的场景，上面两种方法都能完美解决问题啦～

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