用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();

 

花了一晚学习的，留个标记，防止以后忘了

转载于:https://www.cnblogs.com/clso/p/4787854.html