Javascript 获取节点的 XPath

Question

无论如何在 Javascript 中返回 DOM 元素的 XPath 字符串？

原文由 Louis 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

节点没有唯一的 XPath，因此您必须决定构建路径的最合适方法。在可用的情况下使用 ID？文档中的数字位置？相对于其他元素的位置？

请参阅 此答案 中的 getPathTo() 了解一种可能的方法。

原文由 bobince 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

我从另一个例子重构了这个。它将尝试检查或确定是否存在唯一 ID，如果是，则使用该情况来缩短表达式。

 function createXPathFromElement(elm) {
    var allNodes = document.getElementsByTagName('*');
    for (var segs = []; elm && elm.nodeType == 1; elm = elm.parentNode)
    {
        if (elm.hasAttribute('id')) {
                var uniqueIdCount = 0;
                for (var n=0;n < allNodes.length;n++) {
                    if (allNodes[n].hasAttribute('id') && allNodes[n].id == elm.id) uniqueIdCount++;
                    if (uniqueIdCount > 1) break;
                };
                if ( uniqueIdCount == 1) {
                    segs.unshift('id("' + elm.getAttribute('id') + '")');
                    return segs.join('/');
                } else {
                    segs.unshift(elm.localName.toLowerCase() + '[@id="' + elm.getAttribute('id') + '"]');
                }
        } else if (elm.hasAttribute('class')) {
            segs.unshift(elm.localName.toLowerCase() + '[@class="' + elm.getAttribute('class') + '"]');
        } else {
            for (i = 1, sib = elm.previousSibling; sib; sib = sib.previousSibling) {
                if (sib.localName == elm.localName)  i++; };
                segs.unshift(elm.localName.toLowerCase() + '[' + i + ']');
        };
    };
    return segs.length ? '/' + segs.join('/') : null;
};

function lookupElementByXPath(path) {
    var evaluator = new XPathEvaluator();
    var result = evaluator.evaluate(path, document.documentElement, null,XPathResult.FIRST_ORDERED_NODE_TYPE, null);
    return  result.singleNodeValue;
}

原文由 stijn de ryck 发布，翻译遵循 CC BY-SA 3.0 许可协议