文件:evaluate() 方法

Baseline 已廣泛支援

此特性已相當成熟,可在許多裝置和瀏覽器版本上使用。自 ⁨2015 年 7 月⁩以來,各瀏覽器均已提供此特性。

Document 介面的 evaluate() 方法根據引數中給定的 XPath 表示式選擇元素。

XPath 表示式可以在 HTML 和 XML 文件上進行評估。

語法

js
evaluate(xpathExpression, contextNode, namespaceResolver, resultType, result)

引數

xpathExpression

表示要評估的 xpath 的字串。

contextNode

查詢的上下文節點。通常將 document 作為上下文節點。

namespaceResolver

一個函式,它將被傳遞任何名稱空間字首,並且應該返回一個表示與該字首關聯的名稱空間 URI 的字串。它將用於解析 xpath 本身中的字首,以便它們可以與文件匹配。對於 HTML 文件或未使用名稱空間字首時,值 null 很常見。

resultType

一個整數,對應於要返回的 XPathResult 型別。以下值是可能的:

ANY_TYPE (0)

給定表示式自然產生的任何型別。

NUMBER_TYPE (1)

包含單個數字的結果集。例如,在使用 count() 函式的 xpath 表示式中很有用。

STRING_TYPE (2)

包含單個字串的結果集。

BOOLEAN_TYPE (3)

包含單個布林值的結果集。例如,在使用 not() 函式的 xpath 表示式中很有用。

UNORDERED_NODE_ITERATOR_TYPE (4)

包含與表示式匹配的所有節點的結果集。結果集中的節點不一定按照它們在文件中出現的順序排列。

注意:此型別的結果包含對文件中節點的引用。修改節點將使迭代器失效。修改節點後,嘗試遍歷結果將導致錯誤。

ORDERED_NODE_ITERATOR_TYPE (5)

包含與表示式匹配的所有節點的結果集。結果集中的節點按照它們在文件中出現的順序排列。

注意:此型別的結果包含對文件中節點的引用。修改節點將使迭代器失效。修改節點後,嘗試遍歷結果將導致錯誤。

UNORDERED_NODE_SNAPSHOT_TYPE (6)

包含與表示式匹配的所有節點的快照的結果集。結果集中的節點不一定按照它們在文件中出現的順序排列。

注意:此型別的結果是快照,本質上是匹配節點的列表。您可以透過更改快照節點來修改文件。修改文件不會使快照失效;但是,如果文件發生更改,快照可能與文件的當前狀態不一致,因為節點可能已移動、更改、新增或刪除。

ORDERED_NODE_SNAPSHOT_TYPE (7)

包含與表示式匹配的所有節點的快照的結果集。結果集中的節點按照它們在文件中出現的順序排列。

注意:此型別的結果是快照,本質上是匹配節點的列表。您可以透過更改快照節點來修改文件。修改文件不會使快照失效;但是,如果文件發生更改,快照可能與文件的當前狀態不一致,因為節點可能已移動、更改、新增或刪除。

ANY_UNORDERED_NODE_TYPE (8)

包含與表示式匹配的任何單個節點的結果集。該節點不一定是文件中匹配表示式的第一個節點。

FIRST_ORDERED_NODE_TYPE (9)

包含文件中匹配表示式的第一個節點的結果集。

result

用於結果的現有 XPathResult。如果設定為 null,該方法將建立並返回一個新的 XPathResult

返回值

一個連結到所選節點的 XPathResult。如果 resultnull,則它是一個新物件;否則,它與作為 result 引數傳遞的物件相同。

示例

透過 XPath 查詢所有 H2 標題

js
const headings = document.evaluate(
  "/html/body//h2",
  document,
  null,
  XPathResult.ANY_TYPE,
  null,
);
/* Search the document for all h2 elements.
 * The result will likely be an unordered node iterator. */
let thisHeading = headings.iterateNext();
let alertText = "Level 2 headings in this document are:\n";
while (thisHeading) {
  alertText += `${thisHeading.textContent}\n`;
  thisHeading = headings.iterateNext();
}
alert(alertText); // Alerts the text of all h2 elements

請注意,在上面的示例中,更詳細的 xpath 優於常見的快捷方式,例如 //h2。通常,更具體的 xpath 選擇器,如上面的示例,通常會顯著提高效能,尤其是在非常大的文件上。這是因為查詢的評估不會浪費時間訪問不必要的節點。使用 // 通常很慢,因為它會訪問根節點和所有子節點中的每個節點以查詢可能的匹配項。

透過仔細使用上下文引數可以實現進一步的最佳化。例如,如果您知道要查詢的內容在 body 標籤內的某個位置,您可以使用此方法:

js
document.evaluate(".//h2", document.body, null, XPathResult.ANY_TYPE, null);

請注意,在上面的示例中,document.body 已被用作上下文而不是 document,因此 xpath 從 body 元素開始。(在此示例中,“.”很重要,它表示查詢應該從上下文節點 document.body 開始。如果省略“.”(只留下 //h2),查詢將從根節點 (html) 開始,這將更浪費。)

有關更多資訊,請參閱JavaScript 中使用 XPath 的介紹

按 xml:id 獲取元素

此函式是 Document.getElementById() 的替代品,用於您需要按 xml:id 而不是 id 進行搜尋的情況。

js
function getElementByIdWrapper(xmlDoc, id) {
  return xmlDoc.evaluate(
    `//*[@xml:id="${id}"]`,
    xmlDoc,
    () => "http://www.w3.org/XML/1998/namespace",
    XPathResult.FIRST_ORDERED_NODE_TYPE,
    null,
  ).singleNodeValue;
}

規範

規範
DOM
# dom-xpathevaluatorbase-evaluate

瀏覽器相容性

另見