在JavaScript / HTML中，获取指定元素的父元素

在 JavaScript 中，获取一个元素的父元素非常简单，主要通过以下属性或方法实现：

1. 使用parentNode属性

返回当前节点的父节点，可能是元素节点、文档节点或文档片段节点。对于元素节点，通常就是其父元素。

letchild=document.getElementById('myElement');letparent=child.parentNode;

2. 使用parentElement属性

返回当前元素的父元素节点，如果父节点不是元素（例如是文本节点或文档节点），则返回null。推荐在只想获取元素节点时使用。

letchild=document.getElementById('myElement');letparent=child.parentElement;

示例

<divid="parent"><pid="child">点击我</p></div><script>letchild=document.getElementById('child');console.log(child.parentNode);// <div id="parent">...</div>console.log(child.parentElement);// <div id="parent">...</div></script>

注意事项

• 如果当前元素已经是根节点（如html元素），parentNode返回document，而parentElement返回null。
• 对于文本节点或注释节点，parentNode可以获取其父元素，而parentElement始终为null（因为它们不是元素）。

相关方法：closest()

如果你需要向上查找匹配某个 CSS 选择器的祖先元素（包括自身），可以使用closest()方法。

letancestor=element.closest('.some-class');

该方法返回最近的匹配祖先元素，如果没有找到则返回null。