JavaScript 获取父元素 parentNode
时间：06-09来源：作者：点击数：
在本教程中，您将学习如何使用 JavaScript 的 Node 对象的 parentNode 属性获取元素的父元素。
ParentNode 属性介绍
要获取 DOM 树中指定节点的父节点，可以使用节点的 parentNode 属性：
let parent = node.parentNode;
parentNode 是只读属性。
Document 和 DocumentFragment 节点没有父节点。因此，parentNode 属性永远都是 null。
如果您创建一个新节点但尚未将其附加到 DOM 树，则节点的 parentNode 属性也将为 null。
JavaScript 父节点示例
请阅读以下 HTML 文档：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JavaScript parentNode</title>
</head>
<body>
<div id="main">
<p class="note">This is a note!</p>
</div>
<script>
let note = document.querySelector('.note');
console.log(note.parentNode);
</script>
</body>
</html>
下图是浏览器控制台 Console 的输出：
代码是如何运行的：
- 首先，使用 querySelector 方法并指定类名 .note 选择元素。
- 其次，找到该元素的父节点。
结论
- node.parentNode 返回指定节点的只读父节点，如果它不存在则返回 null。
- document 和 DocumentFragment 没有父节点。
方便获取更多学习、工作、生活信息请关注本站微信公众号
湘公网安备 43102202000103号