mirror of
https://github.com/fofolee/uTools-Manuals.git
synced 2025-12-14 22:55:04 +08:00
语法高亮，滚动条美化，设置页面调整
This commit is contained in:
fofolee
@@ -3,8 +3,8 @@
|
||||
<p>使用 XPath 的主要接口是 <a href="/zh-CN/DOM/document" title="zh-CN/DOM/document">document</a> 对象的 <a href="/zh-CN/DOM/document.evaluate" title="zh-CN/DOM/document.evaluate">evaluate</a> 方法。</p>
|
||||
<h2 id="document.evaluate" name="document.evaluate">document.evaluate</h2>
|
||||
<p>此方法针对基于 <a href="https://developer.mozilla.org/en-US/docs/Glossary/XML">XML</a> 的文档（包括 HTML 文档）评估 XPath 表达式，并返回 <a href="https://developer.mozilla.org/en-US/docs/XPathResult">XPathResult</a> 对象，该对象可以是单个节点或一组节点。这个方法的现有文档位于 <a href="https://developer.mozilla.org/en-US/docs/Web/API/Document.evaluate">document.evaluate</a>，但是对于我们现在的需求来说它相当稀疏；下面将给出更全面的研究。</p>
|
||||
<pre class="brush: js">var xpathResult = document.evaluate( xpathExpression, contextNode, namespaceResolver, resultType, result );
|
||||
</pre>
|
||||
<pre><code class="language-javascript">var xpathResult = document.evaluate( xpathExpression, contextNode, namespaceResolver, resultType, result );
|
||||
</code></pre>
|
||||
<h3 id="Parameters" name="Parameters">参数</h3>
|
||||
<p><a href="https://developer.mozilla.org/en-US/docs/Web/API/Document.evaluate">evaluate</a> 函数共有五个参数：</p>
|
||||
<ul>
|
||||
@@ -39,8 +39,8 @@
|
||||
<p>返回 <code>xpathResult</code>，它是 <code>resultType</code> 参数中<a href="https://developer.mozilla.org/en-US/docs/Introduction_to_using_XPath_in_JavaScript#Specifying_the_Return_Type">指定的</a>类型的 <code>XPathResult</code> 对象。<code>XPathResult</code> 在<a class="external" href="http://mxr.mozilla.org/mozilla-central/source/dom/interfaces/xpath/nsIDOMXPathResult.idl" rel="noopener">这里</a>定义。</p>
|
||||
<h3 id="实现默认的命名空间解析器">实现默认的命名空间解析器</h3>
|
||||
<p>我们使用 document 对象的 <code>createNSResolver</code> 方法创建一个命名空间解析器。</p>
|
||||
<pre class="brush: js">var nsResolver = document.createNSResolver( contextNode.ownerDocument == null ? contextNode.documentElement : contextNode.ownerDocument.documentElement );
|
||||
</pre>
|
||||
<pre><code class="language-javascript">var nsResolver = document.createNSResolver( contextNode.ownerDocument == null ? contextNode.documentElement : contextNode.ownerDocument.documentElement );
|
||||
</code></pre>
|
||||
<p><span class="comment">Or alternatively by using the <code>createNSResolver</code> method of a <code>XPathEvaluator</code> object. <pre> var xpEvaluator = new XPathEvaluator(); var nsResolver = xpEvaluator.createNSResolver( contextNode.ownerDocument == null ? contextNode.documentElement : contextNode.ownerDocument.documentElement ); </pre></span></p>
|
||||
<p>然后传递 <code>document.evaluate</code>，将 <code>nsResolver</code> 变量作为 <code>namespaceResolver</code> 参数。</p>
|
||||
<p>注意：XPath 定义不带前缀的 QNames，以仅匹配 null 命名空间中的元素。XPath 没有办法选择应用于常规元素引用的默认命名空间（例如，<code>p[@id='_myid']</code> 对应于 <code>xmlns='http://www.w3.org/1999/xhtml'</code>）。要匹配非命名空间中的默认元素，您必须使用如 <code>[namespace-uri()='http://www.w3.org/1999/xhtml' and name()='p' and @id='_id']</code>（<a href="https://developer.mozilla.org/en-US/docs/Introduction_to_using_XPath_in_JavaScript#Using_XPath_functions_to_reference_elements_with_a_default_namespace">这种方法</a>适用于命名空间未知的动态 XPath），或者使用前缀名测试，并创建一个命名空间解析器将前缀映射到命名空间。如果你想采取后一种方法，阅读更多关于<a href="https://developer.mozilla.org/en-US/docs/Introduction_to_using_XPath_in_JavaScript#Implementing_a_User_Defined_Namespace_Resolver">如何创建一个用户定义的命名空间解析器</a>。</p>
|
||||
@@ -63,15 +63,15 @@
|
||||
</ul>
|
||||
<h5 id="Example" name="Example">示例</h5>
|
||||
<p>以下使用 XPath 表达式 <a href="https://developer.mozilla.org/en-US/docs/XPath/Functions/count"><code>count(//p)</code></a> 来获取 HTML 文档中的 <code><p></code> 元素数：</p>
|
||||
<pre class="brush: js">var paragraphCount = document.evaluate( 'count(//p)', document, null, XPathResult.ANY_TYPE, null );
|
||||
<pre><code class="language-javascript">var paragraphCount = document.evaluate( 'count(//p)', document, null, XPathResult.ANY_TYPE, null );
|
||||
|
||||
alert( 'This document contains ' + paragraphCount.numberValue + ' paragraph elements' );
|
||||
</pre>
|
||||
</code></pre>
|
||||
<p>虽然 JavaScript 允许我们将数字转换为一个字符串进行显示，但 XPath 接口不会自动转换数字结果，如果 <code>stringValue</code> 属性被请求，所以下面的代码将<strong>不</strong>工作：</p>
|
||||
<pre class="brush: js">var paragraphCount = document.evaluate('count(//p)', document, null, XPathResult.ANY_TYPE, null );
|
||||
<pre><code class="language-javascript">var paragraphCount = document.evaluate('count(//p)', document, null, XPathResult.ANY_TYPE, null );
|
||||
|
||||
alert( 'This document contains ' + paragraphCount.stringValue + ' paragraph elements' );
|
||||
</pre>
|
||||
</code></pre>
|
||||
<p>相反，它将返回一个带有 <code>NS_DOM_TYPE_ERROR</code> 的异常。</p>
|
||||
<h4 id="Node-Set_Types" name="Node-Set_Types">节点集类型</h4>
|
||||
<p><code>XPathResult</code> 对象允许以 3 种主要不同类型返回节点集：</p>
|
||||
@@ -90,7 +90,7 @@ alert( 'This document contains ' + paragraphCount.stringValue + ' paragraph elem
|
||||
<p>一旦迭代完成所有的匹配节点，<code>iterateNext()</code> 将返回 <code>null</code>。</p>
|
||||
<p>但请注意，如果在迭代过程中，文档发生突变（文档树被修改），将使迭代无效，并且 <code>XPathResult</code> 的 <code>invalidIteratorState</code> 属性设置为 <code>true</code>，抛出 <code>NS_ERROR_DOM_INVALID_STATE_ERR</code> 异常。</p>
|
||||
<h6 id="Iterator_Example" name="Iterator_Example">Iterator Example</h6>
|
||||
<pre class="brush: js">var iterator = document.evaluate('//phoneNumber', documentNode, null, XPathResult.UNORDERED_NODE_ITERATOR_TYPE, null );
|
||||
<pre><code class="language-javascript">var iterator = document.evaluate('//phoneNumber', documentNode, null, XPathResult.UNORDERED_NODE_ITERATOR_TYPE, null );
|
||||
|
||||
try {
|
||||
var thisNode = iterator.iterateNext();
|
||||
@@ -103,7 +103,7 @@ try {
|
||||
catch (e) {
|
||||
dump( 'Error: Document tree modified during iteration ' + e );
|
||||
}
|
||||
</pre>
|
||||
</code></pre>
|
||||
<h5 id="Snapshots" name="Snapshots">Snapshots</h5>
|
||||
<p>当 <code>resultType</code> 参数中的指定结果类型为：</p>
|
||||
<ul>
|
||||
@@ -113,13 +113,13 @@ catch (e) {
|
||||
<p>返回的 <code>XPathResult</code> 对象是一个匹配节点的静态节点集，这允许我们通过 <code>XPathResult</code> 对象的 <code>snapshotItem(itemNumber)</code> 方法访问每个节点，其中 <code>itemNumber</code> 是要检索的节点的索引。包含的节点总数可以通过 <code>snapshotLength</code> 属性访问。</p>
|
||||
<p>快照不随文档突变而改变，因此与迭代器不同，快照不会变得无效，但是它可能不对应于当前文档，例如节点可能已被移动，它可能包含不再存在的节点，或新节点可能已添加。</p>
|
||||
<h6 id="Snapshot_Example" name="Snapshot_Example">Snapshot Example</h6>
|
||||
<pre class="brush: js">var nodesSnapshot = document.evaluate('//phoneNumber', documentNode, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null );
|
||||
<pre><code class="language-javascript">var nodesSnapshot = document.evaluate('//phoneNumber', documentNode, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null );
|
||||
|
||||
for ( var i=0 ; i < nodesSnapshot.snapshotLength; i++ )
|
||||
{
|
||||
dump( nodesSnapshot.snapshotItem(i).textContent );
|
||||
}
|
||||
</pre>
|
||||
</code></pre>
|
||||
<h5 id="First_Node" name="First_Node">First Node</h5>
|
||||
<p>当 <code>resultType</code> 参数中的指定结果类型为：</p>
|
||||
<ul>
|
||||
@@ -129,10 +129,10 @@ for ( var i=0 ; i < nodesSnapshot.snapshotLength; i++ )
|
||||
<p>返回的 <code>XPathResult</code> 对象只是匹配 XPath 表达式的第一个找到的节点。这可以通过 <code>XPathResult</code> 对象的 <code>singleNodeValue</code> 属性访问。如果节点集为空，这将为 <code>null</code>。</p>
|
||||
<p>请注意，对于无序子类型，返回的单个节点可能不是文档顺序中的第一个，但是对于有序子类型，保证以文档顺序获取第一个匹配的节点。</p>
|
||||
<h6 id="First_Node_Example" name="First_Node_Example">First Node Example</h6>
|
||||
<pre class="brush: js">var firstPhoneNumber = document.evaluate('//phoneNumber', documentNode, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null );
|
||||
<pre><code class="language-javascript">var firstPhoneNumber = document.evaluate('//phoneNumber', documentNode, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null );
|
||||
|
||||
dump( 'The first phone number found is ' + firstPhoneNumber.singleNodeValue.textContent );
|
||||
</pre>
|
||||
</code></pre>
|
||||
<h4 id="ANY_TYPE_常量">ANY_TYPE 常量</h4>
|
||||
<p>当 <code>resultType</code> 参数中的结果类型指定为 <code>ANY_TYPE</code> 时，返回的 <code>XPathResult</code> 对象将是由表达式求值自然产生的任何类型。</p>
|
||||
<p>它可以是任何简单类型（<code>NUMBER_TYPE</code>，<code>STRING_TYPE</code>，<code>BOOLEAN_TYPE</code> ），<strong>但</strong>如果返回的结果类型是节点集，那么它将<strong>只</strong>是一个 <code>UNORDERED_NODE_ITERATOR_TYPE</code>。</p>
|
||||
@@ -141,12 +141,12 @@ dump( 'The first phone number found is ' + firstPhoneNumber.singleNodeValue.text
|
||||
<h3 id="Within_an_HTML_Document" name="Within_an_HTML_Document">在 HTML 文档中</h3>
|
||||
<p>以下代码旨在放置在要针对其评估 XPath 表达式的 HTML 文档中内嵌或外链的任何 JavaScript 片段中。</p>
|
||||
<p>要使用 XPath 提取 HTML 文档中的所有 <code><h2></code> 标题元素，<code>xpathExpression</code> 只是 <code>//h2</code>。其中，<code>//</code> 是递归下降运算符，在文档树中的任何位置将元素与 nodeName <code>h2</code> 相匹配。这个的完整代码是： <span class="comment">link to introductory xpath doc</span></p>
|
||||
<pre class="brush: js">var headings = document.evaluate('//h2', document, null, XPathResult.ANY_TYPE, null );
|
||||
</pre>
|
||||
<pre><code class="language-javascript">var headings = document.evaluate('//h2', document, null, XPathResult.ANY_TYPE, null );
|
||||
</code></pre>
|
||||
<p>请注意，由于 HTML 没有命名空间，因此我们为 <code>namespaceResolver</code> 参数传递了 <code>null</code>。</p>
|
||||
<p>因为希望在整个文档中搜索标题，所以我们使用 document 对象本身作为 <code>contextNode</code>。</p>
|
||||
<p>此表达式的结果是 <code>XPathResult</code> 对象。如果想知道返回的结果的类型，我们可以评估返回的对象的 <code>resultType</code> 属性。在这种情况下，这将评估为 <code>4</code>，即 <code>UNORDERED_NODE_ITERATOR_TYPE</code>。这是 XPath 表达式的结果是节点集时的默认返回类型。它一次提供对单个节点的访问，并且可能不以特定顺序返回节点。要访问返回的节点，我们使用返回对象的 <code>iterateNext()</code> 方法：</p>
|
||||
<pre class="brush: js">var thisHeading = headings.iterateNext();
|
||||
<pre><code class="language-javascript">var thisHeading = headings.iterateNext();
|
||||
|
||||
var alertText = 'Level 2 headings in this document are:\n'
|
||||
|
||||
@@ -154,11 +154,11 @@ while (thisHeading) {
|
||||
alertText += thisHeading.textContent + '\n';
|
||||
thisHeading = headings.iterateNext();
|
||||
}
|
||||
</pre>
|
||||
</code></pre>
|
||||
<p>一旦迭代到一个节点，我们就可以访问该节点上的所有标准 DOM 接口。在遍历从表达式返回的所有 <code>h2</code> 元素之后，对 <code>iterateNext()</code> 的任何进一步调用都将返回 <code>null</code> 。</p>
|
||||
<h3 id="针对扩展中的_XML_文档进行评估">针对扩展中的 XML 文档进行评估</h3>
|
||||
<p>以下使用位于 <a href="">chrome://yourextension/content/peopleDB.xml</a> 的 XML 文档作为示例。</p>
|
||||
<pre class="brush: xml"><?xml version="1.0"?>
|
||||
<pre><code class="language-xml"><?xml version="1.0"?>
|
||||
<people xmlns:xul = "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" >
|
||||
<person>
|
||||
<name first="george" last="bush" />
|
||||
@@ -171,10 +171,10 @@ while (thisHeading) {
|
||||
<phoneNumber>020 7925 0918</phoneNumber>
|
||||
</person>
|
||||
</people>
|
||||
</pre>
|
||||
</code></pre>
|
||||
<p>为了使 XML 文档的内容在扩展中可用，我们创建一个 <a href="https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest"><code>XMLHttpRequest</code></a> 对象以同步加载文档，变量 <code>xmlDoc</code> 将包含该文档作为 <a href="https://developer.mozilla.org/en-US/docs/Web/API/XMLDocument"><code>XMLDocument</code></a> 对象，我们可以使用 <code>evaluate</code> 方法。</p>
|
||||
<p>JavaScript用于扩展 xul/js 文档。</p>
|
||||
<pre class="brush: js">var req = new XMLHttpRequest();
|
||||
<pre><code class="language-javascript">var req = new XMLHttpRequest();
|
||||
|
||||
req.open("GET", "chrome://yourextension/content/peopleDB.xml", false);
|
||||
req.send(null);
|
||||
@@ -184,44 +184,44 @@ var xmlDoc = req.responseXML;
|
||||
var nsResolver = xmlDoc.createNSResolver( xmlDoc.ownerDocument == null ? xmlDoc.documentElement : xmlDoc.ownerDocument.documentElement);
|
||||
|
||||
var personIterator = xmlDoc.evaluate('//person', xmlDoc, nsResolver, XPathResult.ANY_TYPE, null );
|
||||
</pre>
|
||||
</code></pre>
|
||||
<h3 id="注意_2">注意</h3>
|
||||
<p>当未定义 XPathResult 对象时，可以使用 <code>Components.interfaces.nsIDOMXPathResult.ANY_TYPE</code> (<code>CI.nsIDOMXPathResult</code>) 在特权代码中检索常量。类似地，可以使用以下创建 XPathEvaluator：</p>
|
||||
<pre class="brush: js">Components.classes["@mozilla.org/dom/xpath-evaluator;1"].createInstance(Components.interfaces.nsIDOMXPathEvaluator)</pre>
|
||||
<pre><code class="language-javascript">Components.classes["@mozilla.org/dom/xpath-evaluator;1"].createInstance(Components.interfaces.nsIDOMXPathEvaluator)</code></pre>
|
||||
<h2 id="附录">附录</h2>
|
||||
<h4 id="实现用户定义的命名空间解析器">实现用户定义的命名空间解析器</h4>
|
||||
<p>这只是一个例子。此函数将需要从 <code>xpathExpression</code> 获取命名空间前缀，并返回与该前缀对应的 URI。例如，表达式：</p>
|
||||
<pre>'//xhtml:td/mathml:math'
|
||||
</pre>
|
||||
</code></pre>
|
||||
<p>将选择作为 (X)HTML 表数据单元元素的子项的所有 <a class="new" href="https://developer.mozilla.org/en-US/docs/Web/API/MathML" rel="nofollow">MathML</a> 表达式。</p>
|
||||
<p>为了将使用命名空间 URI <code>http://www.w3.org/1998/Math/MathML</code> 的 <code>mathml:</code> 前缀和使用 URI <code>http://www.w3.org/1999/xhtml</code> 的 <code>xhtml:</code> 关联，我们提供了一个函数：</p>
|
||||
<pre class="brush: js">function nsResolver(prefix) {
|
||||
<pre><code class="language-javascript">function nsResolver(prefix) {
|
||||
var ns = {
|
||||
'xhtml' : 'http://www.w3.org/1999/xhtml',
|
||||
'mathml': 'http://www.w3.org/1998/Math/MathML'
|
||||
};
|
||||
return ns[prefix] || null;
|
||||
}
|
||||
</pre>
|
||||
</code></pre>
|
||||
<p>我们对 <code>document.evaluate</code> 的调用将如下所示：</p>
|
||||
<pre class="brush: js">document.evaluate( '//xhtml:td/mathml:math', document, nsResolver, XPathResult.ANY_TYPE, null );
|
||||
</pre>
|
||||
<pre><code class="language-javascript">document.evaluate( '//xhtml:td/mathml:math', document, nsResolver, XPathResult.ANY_TYPE, null );
|
||||
</code></pre>
|
||||
<h4 id="为_XML_文档实现默认命名空间">为 XML 文档实现默认命名空间</h4>
|
||||
<p>如前面<a href="https://developer.mozilla.org/en-US/docs/Introduction_to_using_XPath_in_JavaScript#Implementing_a_Default_Namespace_Resolver">实现默认命名空间解析器</a>中所述，默认解析器不处理 XML 文档的默认命名空间。 例如使用本文档：</p>
|
||||
<pre class="brush: xml"><?xml version="1.0" encoding="UTF-8"?>
|
||||
<pre><code class="language-xml"><?xml version="1.0" encoding="UTF-8"?>
|
||||
<feed xmlns="http://www.w3.org/2005/Atom">
|
||||
<entry />
|
||||
<entry />
|
||||
<entry />
|
||||
</feed>
|
||||
</pre>
|
||||
</code></pre>
|
||||
<p><code>doc.evaluate('//entry', doc, nsResolver, XPathResult.ANY_TYPE, null)</code> 将返回一个空集，其中 <code>nsResolver</code> 是 <code>createNSResolver</code> 返回的解析器。传递一个 <code>null</code> 解析器再好不过了。</p>
|
||||
<p>一种可能的解决方法是创建一个自定义解析器，返回正确的默认命名空间（本例中为 Atom 命名空间）。请注意，您仍然必须在 XPath 表达式中使用一些命名空间前缀，以便解析器函数能够将其更改为所需的命名空间。例如：</p>
|
||||
<pre class="brush: js">function resolver() {
|
||||
<pre><code class="language-javascript">function resolver() {
|
||||
return 'http://www.w3.org/2005/Atom';
|
||||
}
|
||||
doc.evaluate('//myns:entry', doc, resolver, XPathResult.ANY_TYPE, null)
|
||||
</pre>
|
||||
</code></pre>
|
||||
<p>请注意，如果文档使用多个命名空间，则需要更复杂的解析器。</p>
|
||||
<p>下一节将介绍一种可能更好的方法（并允许不提前知道命名空间）。</p>
|
||||
<h4 id="使用XPath函数引用具有默认命名空间的元素">使用XPath函数引用具有默认命名空间的元素</h4>
|
||||
@@ -232,10 +232,10 @@ doc.evaluate('//myns:entry', doc, resolver, XPathResult.ANY_TYPE, null)
|
||||
<p>例如，可能尝试（不正确地）使用 namespaced 属性获取元素，如下所示： <code>var xpathlink = someElements[local-name(@*)="href" and namespace-uri(@*)='http://www.w3.org/1999/xlink'];</code></p>
|
||||
<p>这可能会无意中抓取一些元素，如果它的一个属性存在，本地名称为 <code>href</code>，但它是一个不同的属性，有目标（XLink）命名空间（而不是 <code>@href</code>）。</p>
|
||||
<p>为了使用 XLink <code>@href</code> 属性（而不仅限于命名空间解析器中的预定义前缀）精确地抓取元素，可以按如下方式获取它们：</p>
|
||||
<pre class="brush: js">var xpathEls = 'someElements[@*[local-name() = "href" and namespace-uri() = "http://www.w3.org/1999/xlink"]]'; // Grabs elements with any single attribute that has both the local name 'href' and the XLink namespace
|
||||
<pre><code class="language-javascript">var xpathEls = 'someElements[@*[local-name() = "href" and namespace-uri() = "http://www.w3.org/1999/xlink"]]'; // Grabs elements with any single attribute that has both the local name 'href' and the XLink namespace
|
||||
var thislevel = xml.evaluate(xpathEls, xml, null, XPathResult.ANY_TYPE, null);
|
||||
var thisitemEl = thislevel.iterateNext();
|
||||
</pre>
|
||||
</code></pre>
|
||||
<h4 id="XPathResult_定义的常量">XPathResult 定义的常量</h4>
|
||||
<table class="standard-table">
|
||||
<thead>
|
||||
|
||||
Reference in New Issue
Block a user