HTML DOM parentElement 属性
示例
获取 <li> 元素的父元素的节点名称
var x = document.getElementById("myLI").parentElement.nodeName;
试试看 »
单击元素 (<span>) 以隐藏其父元素 (<div>)
<div>
<span onclick="this.parentElement.style.display = 'none';">x</span>
</div>
试试看 »
描述
parentElement 属性返回指定元素的父元素。
parentElement 和 parentNode 之间的区别在于,如果父节点不是元素节点,则 parentElement 返回 null
document.body.parentNode; // 返回 <html> 元素
document.body.parentElement; // 返回 <html> 元素
document.documentElement.parentNode; // 返回 Document 节点
document.documentElement.parentElement; // 返回 null (<html> 没有父元素节点)
在大多数情况下,使用哪个属性并不重要,但是,parentNode 可能最受欢迎。
此属性为只读。
HTML 节点与元素
在 HTML DOM (Document Object Model) 中,HTML 文档是具有(或没有)子节点的节点集合。
节点 是元素节点、文本节点和注释节点。
元素之间的空格也是文本节点。
元素 仅是元素节点。
childNodes 与 children
childNodes 返回子 节点 (元素节点、文本节点和注释节点)。
children 返回子 元素 (不是文本和注释节点)。
兄弟姐妹与元素兄弟姐妹
兄弟姐妹 是“兄弟”和“姐妹”。
兄弟姐妹 是具有相同父级(在相同的 childNodes 列表中)的节点。
元素兄弟姐妹 是具有相同父级(在相同的 children 列表中)的元素。
语法
node.parentElement
技术细节
返回值 | 一个 Element 对象,表示节点的父元素节点,如果节点没有父级,则为 null |
---|
浏览器支持
element.parentElement
是 DOM Level 3 (2004) 功能。
它在所有现代浏览器中都得到完全支持
Chrome | Edge | Firefox | Safari | Opera | IE |
是 | 是 | 是 | 是 | 是 | 11 |