小兔网

本文主要和大家分享js解析xml实例分享,希望能帮助到大家。

完整目录

js解析xml实例分享

xml 代码

<?xml version="1.0" encoding="gb2312"?><CityList><City Name="北京"><Description>京有着三千余年的建城史和八百五十余年的建都史...</Description></City><City Name="上海"><Description>上海,中国大陆第一大城市;四个中央直辖市之一</Description></City><City Name="广州"><Description>广州,简称穗,别称羊城、穗城、穗垣、仙城、花城;解放前旧称省城。</Description></City><City Name="成都"><Description>位于四川省中部,是中西部地区重要的中心城市。西南地区科技中心、商贸中心、金融中心和交通通信枢纽。</Description></City><City Name="沈阳"><Description>沈阳,辽宁省省会,中国15个副省级城市之一,中国七大区域中心城市之一</Description></City></CityList>

html 代码

<!DOCTYPE html><html><head><meta charset="UTF-8"><title>js解析xml字符串</title></head><body><script type="text/javascript" src="jquery-1.8.2.js"></script><script type="text/javascript">/** * 解析xml的方法     * @param {Object} xmlFile */var loadXML = function (xmlFile) {            var xmlDoc;            if (window.ActiveXObject) {                xmlDoc = new ActiveXObject('Microsoft.XMLDOM');//IE浏览器                xmlDoc.async = false;                xmlDoc.load(xmlFile);            }            else if (isFirefox=navigator.userAgent.indexOf("Firefox")>0) { //火狐浏览器            //else if (document.implementation && document.implementation.createDocument) {//这里主要是对谷歌浏览器进行处理                xmlDoc = document.implementation.createDocument('', '', null);                xmlDoc.load(xmlFile);            }            else{ //谷歌浏览器              var xmlhttp = new window.XMLHttpRequest();                xmlhttp.open("GET",xmlFile,false);                xmlhttp.send(null);                if(xmlhttp.readyState == 4){                xmlDoc = xmlhttp.responseXML.documentElement;                }            }             return xmlDoc;        } $(function(){//绑定下拉列表事件$("#sel").change(function( ){ $("#area").val($(this).val())})//调用读取xml文件的方法,返回xml对象var xml = loadXML("city.xml")   //提取City数据  var countrys = xml.getElementsByTagName('City'); //循环为select下拉列表赋值for(var i = 0; i < countrys.length; i++) {  $("<option></option>").val(countrys[i].textContent).text(countrys[i].getAttribute("Name")).appendTo( $("#sel") ); }; })</script></body><p></p><body><select id="sel"></select> <textarea id="area" cols="30" rows="10"></textarea></body></html>

运行效果:

js解析xml实例分享

js读取xml中的内容,将城市加载到下拉列表,然后变更城市,则将城市描述显示在文本框中;

如下创建解析xml对象

<html><body><script type="text/javascript">try //Internet Explorer  {  xmlDoc=new ActiveXObject("Microsoft.XMLDOM");  }catch(e)  {  try //Firefox, Mozilla, Opera, etc.    {    xmlDoc=document.implementation.createDocument("","",null);    }  catch(e) {alert(e.message)}  }try   {  xmlDoc.async=false;  xmlDoc.load("/example/xdom/books.xml");  document.write("xmlDoc is loaded, ready for use");  }catch(e) {alert(e.message)}</script></body></html>

相关推荐:

PHP解析 XML 数据

用 PHP5 轻松解析 XML

关于 PHP 中如何解析 XML 的问题

以上就是js解析xml实例分享的知识。速戳>>知识兔学习精品课!