XML可扩展标记语言,作为传输和存储数据的载体,在web开发中应用很广泛。在我们需要将XML数据传递给前端时,需要用javascript解析才能使用,所以,使用javascript解析XML也是很普遍的。
通过javascript解析XML,我们可以使用DOM这个强大的工具(针对HTML文档、XML等文档的一套API),也就是通过getElementById或者getElementsByTagName这些方法解析XML。
那它们在解析XML时是否合适,我们考虑下下面的几个问题:
首先XML中每个元素节点不一定有id属性;其次XML中的两个元素节点可能有相同的id属性;这样使用getElementById就不能保证找到我们需要的唯一节点了。而getElementsByTagName一次获取的节点太多,在进行遍历获取数据,比较麻烦。
就XML而言,对比JSON,XML文件庞大,格式复杂,在通过DOM解析显然需要花费更过的资源和时间,用户体验肯定不好。
有没有更好点的方法呢?
XPATH技术—解决问题的良药
XPATH是什么?全称是XML Path Language(XML路径语言),适用于确定XML文档中某节点位置的语言。
我们可以把它当作类似于SQL一样的查询语言,通过给出XPATH路径信息(就像SQL命令一样)就可以从XML中查找出符合条件的节点(就像从数据库中返回需要的数据一样)。
Java中的DOM4j开源包中有selectSingleNode和selectNodes这样两个方法可以根据XPATH表达式来获取一个或多个节点。
在IE6.0及以后版本中我们可以使用同样的方式来访问任意深度的XML数据,这给XML数据的解析操作带来了便利。
但是在firefox等浏览器中,则是使用了w3c标准的XPATH处理方式,没有IE这么简单的方式,firefox中需要建立相应的操作对象和计算方法,才能返回对应的节点。
封装方法,创建在不同浏览器中都可进行XPATH操作的封装方法
//根据指定的XPATH表达式查找满足条件的所有节点
//@param xmldoc 执行查找的节点
//@param sXpath xpath的表达式
function selectNodes(xmldoc,sXpath){
if(window.ActiveXObject){
//IE浏览器
return xmldoc.selectNodes(sXpath);
}else if(window.XPathEvaluator){
//FireFox类浏览器
var xpathObj=new XPathEvaluator();
if(xpathObj){
var result=xpathObj.evaluate(sXpath,xmldoc,null,XPathResult.ORDERED_NODE_ITEARTOR_TYPE,null);
var nodes=new Array();
var node;
while((node = result.iterateNext())!=null) {
nodes.push(node);
}
return nodes;
}else{
return null;
}
}else{
return null;
}
}
//根据指定的XPATH表达式查找满足条件的第一个节点
//@param xmldoc 执行查找的节点
//@param sXpath xpath的表达式
function selectSingleNode(xmldoc,sXpath){
if(window.ActiveXObject){
//IE浏览器
return xmldoc.selectSingleNode(sXpath);
}else if(window.XPathEvaluator){
//FireFox类浏览器
var xpathObj=new XPathEvaluator();
if(xpathObj){
var result=xpathObj.evaluate(sXpath,xmldoc,null,XPathResult.ORDERED_NODE_ITEARTOR_TYPE,null);
return result.singleNodeValue;
}else{
return null;
}
}else{
return null;
}
}
注:
evaluate()方法返回的是一个节点列表,得到节点列表后iterateNext()方法来遍历这个列表中的所有节点。而ORDERED_NODE_ITERATOR_TYPE就是节点的列表,按照文档中节点的属性排列。
实例—通过XPATH表达式获取XML数据
XML
<?xml version="1.0" encoding="UTF-8"?>
<books>
<book isdn="0001">
<author>wang</author>
<name>AJAX Professional</name>
<price>35</price>
</book>
<book isdn="0002">
<author>lee</author>
<name>AJAX In Action</name>
<price>65</price>
</book>
<book isdn="0003">
<author>zhu</author>
<name>AJAX For Dummies</name>
<price>40</price>
</book>
<author>123</author>
</books>
通过调用selectNodes()函数来获取不同参数的值
下面通过六个需求来进行说明
<script type="text/javascript">
function testxpath(){
var rootElement = loadXML(true,"XPATH.xml");
removeBlank(rootElement);
//需求1,获取元素节点
//查找所有的author元素节点
//关键就是如何表式元素节点在DOM树中的路径
// 绝对路径 /books/book/author
// 相对路径 book/author
// 全文档搜索法 //author , //book/author
var author1 = selectNodes(rootElement,"/books/book/author");
var author2 = selectNodes(rootElement,"book/author");
var author2 = selectNodes(rootElement,"//author");
var author2 = selectNodes(rootElement,"//book/author");
//需求2,获取属性节点
//关键是先找到包含属性节点的元素节点
var isdn1 = selectNodes(rootElement,"/books/book/@isdn");
var isdn2 = selectNodes(rootElement,"book/@isdn");
var isdn3 = selectNodes(rootElement,"//book/@isdn");
var isdn4 = selectNodes(rootElement,"//books/@isdn");
//需求3,获取文本节点
//关键是找到包含文本节点的那个元素节点
var text1 = selectNodes(rootElement,"/books/book/name/text()");
var text2 = selectNodes(rootElement,"book/name/text()");
var text3 = selectNodes(rootElement,"//book/name/text()");
var text4 = selectNodes(rootElement,"//name/text()");
//需求4,有条件的查找元素节点
//需要先找到元素节点,然后再增加条件表达式,[条件]
var book1 = selectNodes(rootElement,"/books/book[@isdn]");
var book2 = selectNodes(rootElement,"book[@isdn]");
var book3 = selectNodes(rootElement,"//book[@isdn]");
//需求5,多个添加与关系的查找元素节点
//需要首先找到元素节点,然后每一个查询条件写在一个中括号中
var bookA1 = selectNodes(rootElement,"/books/book[@isdn='0002'][price>35]");
var bookA2 = selectNodes(rootElement,"book[@isdn='0002'][price>35]");
var bookA3 = selectNodes(rootElement,"//book[@isdn='0002'][price>35]");
//需求6,‘|’或关系查找
var bookA3 = selectNodes(rootElement,"//book[@isdn='0002']| /books/book[price>35]");
alert("");
}
</script>
XPath是对专门对XML操作的语言,通过XPath语言,可以很方便的找到你想要的那个节点,代码方便,而且效率。
相比JSON,XML有优点也有缺点,各有优势,进一步研究请关注我的博客。