现在问题就是,IE和fireFox的装载XML方式是不一样的。因此,我们最好封装成一个方法来装载XML。
/**
* @param flag true代表的是文件,false代表的是字符串
* @param xmldoc 要封装成DOM对象的字符串或文件
* @return 返回的是根节点的元素节点
* 重点放在高版本上!!
* */
functionloadXML(flag,xmldoc){
//浏览器是低版本的IE
varobjXml;
if(window.ActiveXObject){
//是IE的话,有两种方式来创建ActiveXObject对象
varname=["MSXML2.DOMDocument","Miscrosoft.XmlDom"];
for(vari=0;i<name.length;i++){
objXml=newActiveXObject(name);
break;
}
//设置为同步【装载XML文件成DOM对象,我们都是同步操作】
objXml.async=false;
//如果是字符串
if(flag==false){
objXml.loadXML(xmldoc);
}else{
//如果是文件
objXml.load(xmldoc)
}
returnobjXml.documentElement;
//浏览器是fireFox或者高版本的IE
}elseif(document.implementation.createDocument){
//字符串
if(flag==false){
//创建对象,解析XML字符串
objXml=newDOMParser();
//解析到根节点
varroot=objXml.parseFromString(xmldoc,"text/xml");
return root.documentElement;
}else{
//由于安全问题,想要得到XML文件,需要通过XMLHttpRequest对象来获取
objXml=newXMLHttpRequest();
//同步
objXml.open("GET","1.xml",false);
objXml.send(null);
//返回XML数据
returnobjXml.responseXML.documentElement;
}
//解析不了啦
}else{
alert("解析不了了");
}
}
测试
去除空白字符
如果有需要就加这段功能吧!
functionremoveBlank(xml){
if(xml.childNodes.length>1){
for(varloopIndex=0;loopIndex<xml.childNodes.length;loopIndex++){
varcurrentNode=xml.childNodes[loopIndex];
if(currentNode.nodeType==1){
removeBlank(currentNode);
}
if(((/^\s+$/.test(currentNode.nodeValue)))&&(currentNode.nodeType==3)){
xml.removeChild(xml.childNodes[loopIndex--]);
}
}
}
}
XPATH
XPATH技术其实我们已经接触过了,在讲解XML的时候,我们已经使用过了XPATH技术了。
可以参考我之前的XML博文:http://blog.csdn.net/hon_3y/article/details/55049184
XPATH总体可分为三种搜索:
- 绝对路径搜索(/根节点/子节点)
- 相对路径搜索(子节点/子节点)【与绝对路径搜索的差别就是开头有无"/"】
- 全文搜索(//子节点)
如果我们要查找属性节点、文本节点、多条件的节点是这样写XPATH的
- 属性节点:(先找到元素节点/@属性名)
- 文本节点:(先找到元素节点/test())
- 有条件查询节点:(先找到元素节点/[条件])
- 多条件查询节点:(先找到元素节点/[条件][条件])【两个条件同时吻合】
- 多条件查询节点:(先找到元素节点/[条件]|先找到元素节点/[条件])【或关系】
我们之前使用dom4j的时候,是调用selectSingleNode()和selectNodes()方法来获取任意深度的节点或多个节点
我们想要在JavaScript中使用XPATH技术,那么我们也实现这两个方法,调用它就行了!
selectSingleNode()
IE10,IE11下无法使用selectSingleNode()方法。解决参考:http://wenda.so.com/q/1458453513726662
但是,我没有解决掉该问题。。。。。
下面是JavaScript代码:
/**
*
* @param xmldoc 代表的是XML的根节点
* @param xpath 给出的XPATH表达式
* @return 返回的是对应的节点或多个节点
*
*
*
*/
functionselectSingleNode(xmldoc,xpath){
//如果是IE,IE10,IE11解决不了....会的人告诉我一声!!
if(navigator.userAgent.indexOf(".NET")>0){
varvalue=xmldoc.selectNodes(xpath)
returnvalue;
}else{
//如果是fireFox
varxpathObj=newXPathEvaluator();
varvalue=xpathObj.evaluate(xpath,xmldoc,null,XPathResult.FIRST_ORDERED_NODE_TYPE,null);
returnvalue.singleNodeValue;
}
}
- 测试代码:
<scripttype="text/javascript"src="loadXML.js"></script>
<scripttype="text/javascript"src="xpath.js"></script>
<scripttype="text/javascript">
functiontest(){
varfile=loadXML(true,"1.xml");
varxpathValue=selectSingleNode(file,"//dd");
varvalue=xpathValue;
alert(value);
}
</script>
- 在fireFox,Chrome浏览器可以正常获取得到节点
selectNodes()
由于上面IE问题我到现在还没有解决,所以下面直接测试FireFox浏览器了。
等我复习到Jquery的时候,再把这里的坑填了吧。。。
- javaScript代码:
/**
*
* @param xmldoc 代表的是XML的根节点
* @param xpath 给出的XPATH表达式
* @return 返回的是节点数组
*/
functionselectNodes(xmldoc,xpath){
varxpathObj=newXPathEvaluator();
//如果是多节点,返回的是迭代器
variterator=xpathObj.evaluate(xpath,xmldoc,null,XPathResult.ORDERED_NODE_ITERATOR_TYPE,null);
//把迭代器的数据写到数组中
vararr=newArray();
varnode;
while((node=iterator.iterateNext())!=null){
arr.push(node);
}
returnarr;
}
- 测试代码:
functiontest(){
varfile=loadXML(true,"1.xml");
varxpathValue=selectNodes(file,"//aa");
varvalue=xpathValue;
alert(value);
}
- 效果: