📌  相关文章
📜  HTML DOM TreeWalker parentNode() 方法(1)

📅  最后修改于: 2023-12-03 14:41:46.045000             🧑  作者: Mango

HTML DOM TreeWalker parentNode() 方法

简介

HTML DOM TreeWalker parentNode() 方法返回 TreeWalker 当前节点的父节点。

TreeWalker 是 HTML DOM 中的一个对象，可以在 DOM 树中遍历节点。该对象可以从指定根节点开始遍历 DOM 树，从而遍历所有的节点。

语法
treeWalker.parentNode()
返回值

该方法返回 TreeWalker 对象当前节点的父节点，如果当前节点没有父节点，返回 null 。

示例

下面代码演示了如何使用 HTML DOM TreeWalker parentNode() 方法：

<!DOCTYPE html>
<html>
<head>
	<title>HTML DOM TreeWalker parentNode() 方法</title>
</head>
<body>
	<div id="myDiv">
		<p>第一段文本。</p>
		<div>
			<p>第二段文本。</p>
		</div>
		<p>第三段文本。</p>
	</div>

	<script>
		// 获取 #myDiv 元素
		var div = document.getElementById("myDiv");

		// 创建 TreeWalker 对象，设置根节点为 #myDiv，遍历所有节点
		var walker = document.createTreeWalker(div, NodeFilter.SHOW_ALL, null, false);

		// 遍历节点，并输出其父节点
		while (walker.nextNode()) {
			console.log("父节点："+walker.parentNode());
		}
	</script>
</body>
</html>

以上代码会输出 HTML DOM TreeWalker 对象遍历到的所有节点的父节点。

注意事项

  • parentNode() 方法只返回节点的直接父节点，不会返回父节点的父节点或其他上级节点。

  • 在遍历 DOM 树时，如果某个节点是根节点，那么它将没有父节点，此时 parentNode() 方法返回 null。