javascript - 在文档中查找节点
问题描述
我已经获得了一个节点document.getSelection().anchorNode
,我想将其视为一个元素,就好像它是由查询选择器获取的一样。假设我的节点是一个p
包含字符串的元素hello world
<p>hello world</p>
该节点出现在 DOM 中:
<!doctype html>
<html>
<head>
<link rel="stylesheet" href="/master.css" />
</head>
<body>
<p>hello world</p>
</body>
</html>
我想<p>
从文档中获取元素。但是,一个看起来相同的节点可能会出现多次,我想获取该节点来自的 HTML 元素。
谢谢
解决方案
假设我的节点是一个
p
包含字符串 hello world 的元素
然后anchorNode
将是您从中获得的完全相同querySelector
的对象。
但是,如果它是该元素中p
的 Text 节点,则您可能希望使用它anchorNode.parentElement
来访问该p
元素。
现场示例:
var lastNode = null;
setInterval(function() {
var selection = window.getSelection();
var node = (selection && selection.anchorNode) || null;
if (node === lastNode) {
return;
}
lastNode = node;
if (!node) {
console.log("(No selection)");
} else {
var result = "Node name is " + node.nodeName;
if (node.nodeType === 3) { // Text
console.log(result, "parent element:", node.parentElement);
} else {
console.log(result);
}
}
}, 250);
Select some text, an analysis of <code>window.getSelection().anchorNode</code>'s result will appear in the console.
<p>hello world</p>
推荐阅读
- mediawiki - importImages.php 没有将所有文件移动到正确的子目录中
- javascript - 类型错误:fn.bind 不是函数。不和谐.js v13
- python - 分箱时如何包含 0 值
- c++ - c++: 找不到 numpy/arrayobject.h 和 Python.h
- javascript - 如何转换此对象数组中的对象?
- django - RetrieveAPIView Django Rest框架,当数据库中不存在lookup_field详细信息时返回自定义响应
- c++ - 使用类模板的派生类型作为模板模板参数
- firebase - FirebaseUser 不是现有的类 | 身份验证错误
- python - 文件在同一个文件夹中,但仍然得到 FileNotFoud
- arrays - 在python多处理中传递共享内存变量