xpath 总结1

根据W3说明 “XPath 是一门在 XML 文档中查找信息的语言。XPath 可用来在 XML 文档中对元素和属性进行遍历。”

主流浏览器除了IE之外全部支持解析xpath的方法 document.evaluate

下面记录一些xpath中常用的表达式

1.HTML页面结构如下

<body>
	<div id="main">
		<header>
			<h1>this is an page about xpath using skills</h1>
		</header>
		<div>
			<table>
				<tr>
					<td>name</td><td>link</td>
				</tr>
				<tr>
					<td>mike</td>
					<td>
						<a href="http://www.360.com">360</a>
						<a href="http://www.baidu.com">baidu</a>
					</td>
				</tr>
				<tr>
					<td>jack</td><td><a href="http://www.google.com">google</a></td>
				</tr>
				<tr>
					<td>luke</td><td><a href="http://www.Twitter.com">Twitter</a></td>
				</tr>
			</table>
			<a>good</a>
			<a href="http://www.linkwithblank.com"> link </a>
			<a href="http://www.lastlink.com"> lastlink </a>
		</div>
	</div>
</body>

一些常用的 xpath方法

{
	//获取所有A标签 这里返回按照文档顺序查找到的第一个节点
	var linka = document.evaluate("//a", document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null);
	console.info(linka.singleNodeValue);
}

{
	//获取所有A标签 这里返回所有按照文档顺序查找的所有节点
	var links = document.evaluate("//a", document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
	for(var i = 0; i < links.snapshotLength; i++) {
		console.info(links.snapshotItem(i).text);
	} 
}

//常用的匹配的第一个节点的方法
function getSingleNodeByXpath(xpath){
	var ret = document.evaluate(xpath, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null);
	return ret.singleNodeValue;
}

{
	//获取文本值为google的xpath方法
	var node = getSingleNodeByXpath("//a[text()='google']");
	console.info(node.outerHTML)
}

{
	//获取文本值为google的xpath方法
	var node = getSingleNodeByXpath("//a[normalize-space(text())='link']");
	console.info(node.outerHTML)
} 

{
	//过滤空白的字符串
	var node = getSingleNodeByXpath("//a[normalize-space(text())='link']/../..");
	console.info(node.tagName+"#"+node.id)
} 

{
	//包含某个字符串
	var node = getSingleNodeByXpath("//a[contains(text(),'itter')]");
	console.info(node.outerHTML)
}

{
	//索引取值，查询依据是根据同一个父节点下的相同子节点来获取的  首先找到的 是 360 baidu两个节点， 然后返回最后一个
	var node = getSingleNodeByXpath("//div[@id='main']//a[last()]");
	//返回的是<a href="http://www.baidu.com">baidu</a>
	console.info(node.outerHTML)
	
	//如果要返回div#main下面的 最后一个lastlink 需要修改为
	var node1 = getSingleNodeByXpath("(//div[@id='main']//a)[last()]");
	//返回的是<a href="http://www.lastlink.com"> lastlink </a>
	console.info(node.outerHTML)
}

[注]

XPathResult 对象 http://www.w3school.com.cn/xmldom/dom_xpathresult.asp　　

xpath语法 http://www.w3school.com.cn/xpath/index.asp