我正在尝试创建一个用户可以在浏览器中存储注释的应用程序 .
为了确定用户在文档中创建注释的位置,我正在尝试存储所选文本的xpath和偏移量 .
我一直在搜索,似乎有许多从xPath字符串中检索元素的例子,但不是从DOM元素中查找xPath的好例子 .
这是我尝试过的:
//Find xPath and pass the object
var range_obj = {
start: getXPathForElement(range.startContainer, range.startContainer.ownerDocument),
end: getXPathForElement(range.endContainer, range.endContainer.ownerDocument),
startOffset: range.startOffset,
endOffset: range.endOffset
};
其中getXPathForElement如下所示:
function getXPathForElement(el, xml) {
var xpath = '';
var pos, tempitem2;
while (el !== xml.documentElement) {
pos = 0;
tempitem2 = el;
while (tempitem2) {
if (tempitem2.nodeType === 1 && tempitem2.nodeName === el.nodeName) { // If it is ELEMENT_NODE of the same name
pos += 1;
}
tempitem2 = tempitem2.previousSibling;
}
xpath = "*[name()='" + el.nodeName + "' and namespace-uri()='" + (el.namespaceURI === null ? '' : el.namespaceURI) + "'][" + pos + ']' + '/' + xpath;
el = el.parentNode;
}
xpath = '/*' + "[name()='" + xml.documentElement.nodeName + "' and namespace-uri()='" + (el.namespaceURI === null ? '' : el.namespaceURI) + "']" + '/' + xpath;
xpath = xpath.replace(/\/$/, '');
return xpath;
}
并且这段代码给出了一个非常长的奇怪的文本,如下所示:(我认为这不是一个正确的xPath) .
“/ [name()='HTML'和namespace-uri()='http://www.w3.org/1999/xhtml'] / [name()='BODY'和namespace-uri()= 'http://www.w3.org/1999/xhtml'][1]/[name()='P'和namespace-uri()='http://www.w3.org/1999/xhtml' ] [1] / [name()='SPAN'和namespace-uri()='http://www.w3.org/1999/xhtml'] [4] / [name()='SPAN'和命名空间-uri()='http://www.w3.org/1999/xhtml'] [2] / [name()='#text'和namespace-uri()='undefined'] [0]“
但是在Chrome Inspect Element中,它提供了一些干净的字符串,如下所示:
// * [@ id =“tinymce”] / p / span [2] / span [2] / strong
任何人都可以帮助我从文档中检索元素的xpath,然后在xpath中找到元素吗?
1 回答
如果你能够使用Saxon-JS,那么你可以使用XPath 3.0函数fn:path(),它专门为此目的而设计 .