手机端小强原创文章,java小强个人博客站点
当前位置: 首页 >> JS >> JS跨浏览器解析XML应用

JS跨浏览器解析XML应用

40230 JS | 2014-6-18

首先介绍简单的理论:
对于XML,我们可以理解它是一种树结构,它包含根,元素,属性,文本等内容。不同浏览器都有自己的解析器,把XML读入内存,并把它转换为可被 JavaScript 访问的 XML DOM 对象。
微软的 XML 解析器与其他浏览器中的解析器是有差异的。微软的解析器支持对 XML 文件和 XML 字符串(文本)的加载,而其他浏览器使用单独的解析器。不过,所有的解析器都含有遍历 XML 树、访问、插入及删除节点的函数。
如果你使用的是一个本地文件或者网络文件且该文件在是在本服务器,那么对于IE和其他浏览器来说都可以通过load(uRl),loadXML(strXML)来创建Xdom对象。但是对于文本,除IE外需要一个单独的解析器来处理。
以下函数用于根据不同的浏览器来创建Xdom对象:

function loadXMLDoc() {
 var xmlDoc;
 // code for IE
 if (window.ActiveXObject){
   xmlDoc=new ActiveXObject("Microsoft.XMLDOM");//创建空的微软 XML 文档对象
   //xmlDoc.load(uRl);
   //loadXML() 方法用于加载字符串(文本),而 load() 用于加载文件
   xmlDoc.loadXML(xmlstr);
 }
 // code for Mozilla, Firefox, Opera, etc.
 else if(document.implementation&&document.implementation.createDocument){ 
   xmlDoc=document.implementation.createDocument("","",null);
   //xmlDoc.load(uRl);
   //Internet Explorer 使用 loadXML() 方法来解析 XML 字符串,而其他浏览器使用 DOMParser 对象
   parser=new DOMParser();
   xmlDoc=parser.parseFromString(txt,"text/xml");
 }else{
   alert('Your browser cannot handle this script');
 }
 //关闭异步加载,这样可确保在文档完整加载之前,解析器不会继续执行脚本
 xmlDoc.async=false; 
 createTable(xmlDoc);
}

 

方法内有具体的解析,我不再啰嗦,对于解析的内容,分为字符串和文本两种。
首先定义一个字符串:

var xmlstr="<?xml version=\"1.0\" encoding=\"UTF-8\"?><goodss><goods id=\"1\">
<name>数码相机</name><price>3206(元)</price></goods>
<goods id=\"2\"><name>联想笔记本电脑</name><price>3206(元)</price></goods></goodss>";

 

然后定义一个goods.xml文件:

<?xml version="1.0" encoding="UTF-8"?>
<goodss>
 <goods id="1">
  <name>数码相机</name>
  <price>3206(元)</price>
 </goods>
 <goods id="2">
  <name>联想笔记本电脑</name>
  <price>3206(元)</price>
 </goods>
</goodss>

 

通过取消和注释方式来选择是文本还是字符串。
这个方法可以是通用的,下面再来解析这个Xdom对象:

function createTable(xmldoc){
 var goodss=xmldoc.getElementsByTagName("goods");
 for(var i=0;i<goodss.length;i++){
  var g=goodss[i];
  if (g.nodeType==1){
   var name=g.getElementsByTagName("name")[0].childNodes[0].nodeValue;
   var price=g.getElementsByTagName("price")[0].childNodes[0].nodeValue;
   var id=g.getAttribute("id");
   document.write(id +  "-->" + name + "-->" + price);
   document.write("<br />");
  }
 } 
}

 

对于使用到的函数和属性我们来解析一下:

一些典型的 DOM 属性
x.nodeName - x 的名称
x.nodeValue - x 的值
x.parentNode - x 的父节点
x.childNodes - x 的子节点
x.attributes - x 的属性节点
x.firstChild - x 的第一个子节点,等同于childNodes[0]
x.lastChild  - x 的最后一个子节点
x.data - x 的内容,等同nodeValue
x.length - x 的长度
x.nodeType - x 的类型:1,元素,2,属性,3,文本,4,注释,5,文档
在上面的列表中,x 是一个节点对象
XML DOM 方法
x.getElementsByTagName(name) - 获取带有指定标签名称的所有元素,返回的是数组
x.getAttribute(name) - 返回属性的值

注意
出于安全方面的原因,现代的浏览器不允许跨域的访问。这意味着,网页以及它试图加载的 XML 文件,都必须位于相同的服务器上。否则,xmlDoc.load() 将产生错误 "Access is denied"。

 

页面增加一个按钮来调用函数:

<input type="button" name="bxml" value="Read" onclick="loadXMLDoc()" />

 

页面将会输出XMl内节点的属性和子节点的内容。对于一般应用来说,我觉得上面内容已经足够了。我会在之后补充一些其他操作。

 

推荐您阅读更多有关于“ js xml ActiveXObject ie 火狐 XMLDOM ”的文章

上一篇:关于读取Src下配置文件的那个传说 下一篇:JavaScript中XMLHttpRequest对象初步使用

猜你喜欢

发表评论:

个人资料
blogger

java小强
没有思考,人生的路会越走越难!

搜索
分类
最新微语
  • 车也学了,年也过了,生日也过了,村里的会也赶了,这次,是真的,年过去了。不过我没回京,也没有在家找工作,我在等什么吗?反正现在正合了我这个懒人的要求,不过,我歇不住,思考下人生。

    2018-03-20 00:11

  • 8月1日,我已离开奋斗多年的北京。不知道是暂时的离开,还是永久的离别,反正已经离职在家,告别每日上班,每天苦累的煎熬,过一段属于自己的生活。以前是专职工作,现在专职生活。

    2017-08-18 12:47

  • 又弄完一个项目,累成狗,但是感觉又进步不少,除了很多坑已经踩过,做起来也是轻车熟路。同时也认识到,程序不在于你多牛逼,而是在乎你的细节把控度,而细节的关注,是一个优秀程序员必须要注意的。另外,要相信自己,勇敢向前,没人生下来就是成功的,而且,成功的路,比成功本身更重要。

    2017-06-30 09:46

  • 今日北京再次沙尘暴来袭,吃了几年细粮,终于能来口粗粮了,不过大早上看见这场景,还是吓我一跳,不过随后就平静了,毕竟是老朋友了。进公司又发现一股烤糊的味道,真是祸不单行啊,例外都是污染。发了两个口罩,开启保护模式。

    2017-05-04 10:16

  • 今天同学问我,最近还在写代码吗?我想了想,这个问题怎么回答呢,我好像确实很长时间,虽然写了一些,但是主要内容已经不是写代码了。然后再想想,自己也7年多了,这么多年了,我收获了什么,我的目标到底是什么。眼看就奔三了,人生啊,开启感叹模式。

    2017-03-30 22:52

  • 更多»

最新文章
热门文章
随机文章