XPath 在动态 HTML 文档中不起作用 [英] XPath Doesn't Work in Dynamic HTML-Document
问题描述
注意:此问题及其答案适用于大多数/所有支持 XPath 的编程语言和库，而不仅仅是 JavaScript！
使用以下代码创建一个非常简单的 HTML 页面(实际代码加载远程页面，但我试图将您的注意力集中在此处的主要问题上):
With the following code that creates a very simple HTML-page (the actual code loads a remote page, but I'm trying to put your focus on the main problem here):
var dt = document.implementation.createDocumentType("html", "-//W3C//DTD HTML 4.01 Transitional//EN", "http://www.w3.org/TR/html4/loose.dtd");
var doc = document.implementation.createDocument("http://www.w3.org/1999/xhtml", "html", dt);
var src = "<head></head><body></body>";
doc.documentElement.innerHTML = src;
alert(doc.evaluate(".", doc, null, XPathResult.ANY_UNORDERED_NODE_TYPE, null).singleNodeValue);
alert(doc.evaluate("/body", doc, null, XPathResult.ANY_UNORDERED_NODE_TYPE, null).singleNodeValue);
alert(doc.evaluate("//body", doc, null, XPathResult.ANY_UNORDERED_NODE_TYPE, null).singleNodeValue);
alert(doc.evaluate("/html", doc, null, XPathResult.ANY_UNORDERED_NODE_TYPE, null).singleNodeValue);
第一个 alert() 显示[object HTMLDocument]"，另一个 alert() 显示null".这是为什么?我缺少什么才能使 XPath 查询工作并让它找到正文元素?
The first alert() shows "[object HTMLDocument]", the other alert() shows "null". Why is that? What am I missing to make XPath queries work and have it find the body-element?
- 在示例中添加了//body"
- 我想我应该提到我使用的是 Opera 12.17.是否有任何解决方法可以让我得到相同的结果?
推荐答案
第一个 XPath 选择文档根目录(. 是当前上下文).
The first XPath selects the document root (. is the current context).
第二个为空，因为根上下文中没有 body.您可以使用:
The second one is null because there is no body at the root context. You could use:
/html/body
或
//body
这将为您提供节点.从那里您可以使用上下文 XPath 表达式或 DOM 方法和属性获取上下文中的子节点.要查看节点名称，您可以使用所选节点上的 nodeName 属性:
This will get you the nodes. From there you can get child nodes in context using contextual XPath expressions or DOM methods and properties. To see the node names you can use the nodeName property on the node you selected:
doc.evaluate(".", doc, null, XPathResult.ANY_UNORDERED_NODE_TYPE, null)
.singleNodeValue.nodeName;
doc.evaluate("//body", doc, null, XPathResult.ANY_UNORDERED_NODE_TYPE, null)
.singleNodeValue.nodeName;
这个替代版本使用 DOM 来创建节点.
This alternative version uses DOM to create the nodes.
var head = document.createElement("head");
var body = document.createElement("body");
doc.documentElement.appendChild(head);
doc.documentElement.appendChild(body);
它还强制一个命名空间(在 Chrome 中被忽略，在第一个例子中)，所以 XPath 表达式要么需要包含一个命名空间映射函数(作为 evaluate 方法的第三个参数，或忽略它们(使用通配符和本地名称测试，如下例所示).
It also enforces a namespace (which is ignored in Chrome, in the first example), so the XPath expressions either need to include a namespace mapping function (as the third parameter of the evaluate method, or ignore them (using wildcards and local name testing as in the example below).
doc.evaluate(".//*[local-name()='body']", doc.documentElement, null, XPathResult.ANY_UNORDERED_NODE_TYPE, null).singleNodeValue.nodeName
请注意，我还使用了 doc.documentElement 作为上下文节点.
Note that I also used doc.documentElement as the context node.
在浏览器中试试:
这篇关于XPath 在动态 HTML 文档中不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
