用XPath查找HTML節點或元素

更新版之後會在個人新博客更新，請您移步 https://blog.clso.fun/posts/2019-03-03/46.html

 

雖然JQ和JS都能很方便的查找包含了ID及類名的元素，但某些狀況下，咱們須要查找一些不包含類名、ID的元素或節點，就須要XPath來幫忙了。

XPath雖然是被設計用來搜尋XML文檔的，不過它也能很好的在HTML文檔中工做，而且大部分瀏覽器也支持經過XPath來查詢節點。

XPath既然叫Path，就是以路徑的形式來指定元素。關於XPath的語法，這裏很少贅述，請自行查詢相關資料。

 

XPath的查詢函數，在IE中與其餘瀏覽器（Chrome、Firefox、Opear等）是不同的，因此若是你的網站須要兼容IE，須要注意。

Xpath在IE中的查詢函數爲 document.selectNodes(xpath)，其返回的是一個集合，經過for循環就能夠讀取全部的元素。

var nodes=document.selectNodes("//a[@href]");
for (i=0;i<nodes.length;i++){
    // 對 nodes[i] 執行操做;
}

// 這裏要注意，IE對於元素的默認索引序列是從0開始的，不符號W3C標準
// 添加下面這行代碼，讓其符合W3C標準
document.setProperty("SelectionLanguage","XPath"); //設置語言選擇
nodes=document.selectNodes("//div[1]");

 

而其餘瀏覽器的查詢函數，調用就稍微複雜一點，都是採用 document.evaluate 這個函數，返回的是一個枚舉集合，須要使用 while 循環來枚舉元素。

var result = document.evaluate("//a[@href]", document, null, XPathResult.ANY_TYPE, null);
var nodes = result.iterateNext(); //枚舉第一個元素
while (nodes){
    // 對 nodes 執行操做;
    nodes=result.iterateNext(); //枚舉下一個元素
}

// 若是隻查找單個元素，能夠簡寫成這樣
nodes=document.evaluate("//div[1]", document).iterateNext();

 

花了一晚學習的，留個標記，防止之後忘了