HTML DOM parentElement 属性

示例

获取 <li> 元素的父元素的节点名称：

var x = document.getElementById("myLI").parentElement.nodeName;

亲自试一试 »

单击一个元素 (<span>) 以隐藏其父元素 (<div>)：

亲自试一试 »

描述

ParentElement 属性返回指定元素的父元素。

父元素和父元素之间的区别父节点，是parentElement返回无效的如果父节点不是元素节点：

document.body.parentNode; // Returns the <html> element
document.body.parentElement; // Returns the <html> element

document.documentElement.parentNode; // Returns the Document node
document.documentElement.parentElement; // Returns null (<html> does not have a parent ELEMENT node)

在大多数情况下，使用哪个属性并不重要，但是，parentNode 可能是最受欢迎的。

该属性是只读的。

HTML 节点与元素

在里面HTML 文档对象模型（文档对象模型），HTML 文档是带有（或不带有）子节点的节点的集合。

节点分别是元素节点、文本节点和注释节点。

元素之间的空白也是文本节点。

元素只是元素节点。

子节点 vs 子节点

子节点返回孩子节点（元素节点、文本节点和注释节点）。

孩子们返回孩子元素（不是文本和注释节点）。

兄弟姐妹 vs 元素兄弟姐妹

兄弟姐妹是"brothers" 和"sisters"。

兄弟姐妹是具有相同父节点的节点（在同一子节点列表）。

元素兄弟姐妹是具有相同父级的元素（在同一孩子们列表）。

语法

node.parentElement

技术细节

返回值：	一个 Element 对象，表示节点的父元素节点，或者无效的如果该节点没有父节点

浏览器支持

element.parentElement是 DOM Level 3 (2004) 功能。

所有现代浏览器都完全支持它：


Chrome	Edge	Firefox	Safari	Opera	IE
Yes	Yes	Yes	Yes	Yes	11