javascript - 获取 HTML/DOM 的所有元素的 XPATH
问题描述
最好在Javascript中。[也许] 遍历所有节点console.log()
及其XPath
.
我搜索得足够多,但找不到答案。
为什么我需要它?
我想查看oordinates(getBoundingClientRect())
DOM 的所有叶节点的 c(意思是 HTML 的元素)。
解决方案
如何遍历页面上的所有 DOM 元素以及如何获取 X/HTML 文件中元素的 XPath 的组合
应该做:
function getXPath(node) {
var comp, comps = [];
var parent = null;
var xpath = '';
var getPos = function(node) {
var position = 1, curNode;
if (node.nodeType == Node.ATTRIBUTE_NODE) {
return null;
}
for (curNode = node.previousSibling; curNode; curNode = curNode.previousSibling) {
if (curNode.nodeName == node.nodeName) {
++position;
}
}
return position;
}
if (node instanceof Document) {
return '/';
}
for (; node && !(node instanceof Document); node = node.nodeType == Node.ATTRIBUTE_NODE ? node.ownerElement : node.parentNode) {
comp = comps[comps.length] = {};
switch (node.nodeType) {
case Node.TEXT_NODE:
comp.name = 'text()';
break;
case Node.ATTRIBUTE_NODE:
comp.name = '@' + node.nodeName;
break;
case Node.PROCESSING_INSTRUCTION_NODE:
comp.name = 'processing-instruction()';
break;
case Node.COMMENT_NODE:
comp.name = 'comment()';
break;
case Node.ELEMENT_NODE:
comp.name = node.nodeName;
break;
}
comp.position = getPos(node);
}
for (var i = comps.length - 1; i >= 0; i--) {
comp = comps[i];
xpath += '/' + comp.name;
if (comp.position != null) {
xpath += '[' + comp.position + ']';
}
}
return xpath;
}
var all = document.getElementsByTagName("*");
for (var i=0, max=all.length; i < max; i++) {
console.log(getXPath(all[i]));
}
更新的版本比第一部分好得多。
推荐阅读
- mysql - 如何从与 sequelize 的关联中获取所有数据
- azure-data-factory - 如何在 DF 数据流、数据集源选项中使用管道参数
- python - python 语法的建议 - 将实施什么?
- verilog - Verilog 编译错误:未识别的变量 2'b00
- typescript - TypeScript:如何将类型属性转换为类成员
- javascript - 如何停止 HTML 文本框中的特殊字符?
- javascript - 如何找到 9 周前的星期天,而不管今天是一周中的哪一天使用 JavaScript
- r - API 推特和推特
- maven - 如何将活动选择参数的选定值传递给构建脚本
- python - Python中索引的其他形式