JavaScript >> Javascript 文檔 >  >> JavaScript

JavaScript 中的 XPath,第 2 部分

在我的上一篇文章中,我介紹了 Firefox、Safari、Chrome 和 Opera 中的 DOM Level 3 XPath 支持。那篇文章缺少關於 XPath 中的名稱空間和名稱空間解析的討論。如果您只是使用 XPath 來查詢 HTML 文檔,那麼 evaluate() 的命名空間解析器參數 永遠是 null;如果您打算在包含命名空間的 XML 文檔上使用 XPath,那麼您需要學習如何創建和使用命名空間解析器。

每個命名空間 URI 都映射到 XML 文檔中定義的特定前綴,但默認命名空間除外,它不需要前綴。命名空間解析器為 XPath 引擎執行命名空間前綴和命名空間 URI 之間的映射。有兩種方法可以創建命名空間解析器。首先是創建一個函數,該函數接受命名空間前綴作為參數並返回適當的 URI。例如:

function resolver(prefix){
    switch(prefix){
        case "wrox": return "http://www.wrox.com/";
        case "ncz": return "https://humanwhocodes.com/";
        default: return "http://www.yahoo.com/";
    }
}

如果您已經有了方便的前綴和命名空間 URI,這種方法可能會起作用。當要解析默認命名空間時,會將一個空字符串傳遞給函數。

第二種方法是使用包含命名空間信息的節點創建命名空間解析器,例如:

<books xmlns:wrox="http://www.wrox.com/" xmlns="http://www.amazon.com/">
    <wrox:book>Professional JavaScript</book>
</books>

<books> 元素包含此 XML 片段的所有命名空間信息。您可以將對此節點的引用傳遞到 XPathEvaluator 對象的 createNSResolver() 方法並自動創建命名空間解析器:

var evaluator = new XPathEvaluator();
var resolver = evaluator.createNSResolver(xmldoc.documentElement);

當命名空間信息嵌入到 XML 文檔中時,這種方法更有用,在這種情況下,複製該信息並將 JavaScript 與 XML 文檔緊密耦合是沒有意義的。

使用任何一種方法,您都可以輕鬆地評估具有名稱空間的 XML 文檔上的 XPath 表達式:

var evaluator = new XPathEvaluator();
var resolver = evaluator.createNSResolver(xmldoc.documentElement);
var result = evaluator.evaluate("wrox:book", xmldoc.documentElement,
                 resolver, XPathResult.FIRST_ORDERED_NODE_TYPE, null);
if (result){
    alert(result.singleNodeValue.firstChild.nodeValue);
}

如果在對使用命名空間的文檔運行 XPath 查詢時不提供命名空間解析器,則會發生錯誤。

同樣,此信息對 Firefox、Safari、Chrome 和 Opera 有效; Internet Explorer 本身並不支持 DOM Level 3 XPath。不過,它在其他瀏覽器中仍然是一個選項,用於超快速 DOM 查詢。


Tutorial JavaScript 教程
  1. 將 React 路由器添加到您的應用程序

  2. Observablehq.com 上的 WEBCode.run 私有端點已發布!

  3. 重構為折射

  4. 你應該知道 xicons.org

  5. localStorage.getItem('item') 是否優於 localStorage.item 或 localStorage['item']?

  6. Node.js 是 SemVer

  7. 使用 NuxtJs 的 Laravel Api 身份驗證(Sanctum)(第 2 部分)

  1. 帶有類裝飾器的 ESlint

  2. 碘化物:網絡科學交流和探索的實驗工具

  3. 在 ASP.NET 中重定向之前的 Javascript 警報

  4. 取消 Axios 請求以防止 React 對你大喊大叫。

  5. 塗鴉 0.7.0 發布

  6. 設置 Docker + TypeScript + Node(在運行的容器中熱重載代碼更改)🦄 🚀

  7. React 101 - 第 2 部分:第一個組件

  1. 帶有 dockerized ReactJS 應用程序的 GitLab CI/CD 示例🚀

  2. 使用 Podium 構建 Svelte 微前端

  3. 快速入門:如何使用 React 和 Altogic 構建博客應用程序?

  4. React 組件和元素之間的區別