首页 > 代码库 > js加载xml文件xin
js加载xml文件xin
作为刚进入软件开发大军的我,以一个水军的资格开始做梦,以一个画者的资格在‘一张白纸’上开始涂抹。工作在哪里??工作在哪里呢???
今天发现一道面试题:
附件中有一个城市列表的city.xml文件,现在需要您通过Javascript脚本对该文件进行解析,然后将城市列表还原到下拉列表框中;当选择下拉列表框时,在对应的文本框中显示该城市信息(界面布局请参考test1.html文件,也可以自行定义)。
上网查了一天的资料,绞尽脑汁的试着网上前辈的各种方法,为什么一个个别人成功的案例,到了自己这里就大相径庭了呢???在纠结了一天,在上网查了一天的资料之后,在这里总结一下自己的第一篇博文。
随着js创始公司的解体,js的后期并没有随着浏览器的纷杂的发展得以很好的维护,在兼容性上出现了一系列的问题。那么js加载xml随使用浏览器的不同有如下几种情况。(可能还有,只是作为菜鸟的俺还不知道哦)
1.适用IE低版本IE9以内的(现在应该很少了)。
function loadxml(){ //IE9版本以内的MSXML库有以下三个版本,不同的版本使用不同的库。 var version = [ ‘MSXML2.DomDocument6.0‘, ‘MSXML2.DomDocument3.0‘, ‘MSXML2.DomDocument‘ ]; for(var i=0;i<version.length;i++){ try { //创建加载xml的执行者 var xmlDom = new ActiveXObject(); return xmlDom; } catch (e) { } } throw Error("您的系统或浏览器不支持MSXML"); } //加载xml格式的字符串 var xmlDom = loadxml(); xmlDom.loadXML(‘<root><user>aaa</user></root>‘); //获得user的test值 var userText = xmlDom.getElementsByTagName("user")[0].firstChild.nodeValue; //加载xml外部文件 var xmlDom2 = loadxml(); xmlDom2.load("demo.xml"); //在xml文本中添加节点 var xmlDom3 = loadxml(); xmlDom3.load("demo.xml"); var bbb = xmlDom3.createElement("bbb"); var root=xmlDom3.documentElement; root.appendChild(bbb); //服务器端默认使用异步加载。如果异步加载没有加载完毕就是用该数据就会报出错误 //使用同步加载,默认为true。同步加载会出现假死的情况。 xmlDom.async=false; //使用异步加载的方法 xmlDom.asybc=true xmlDom.onreadystatechange = function(){ if(xmlDom.readyState==4){ if(xmlDom.parseError.errorCode==4){ //没有错误,执行加载后的程序..... alert(xmlDom.xml); }else{ throw new Error("错误行号:"+xmlDom.parseError.line+ "错误代号:"+xmlDom.parseError.errorCode+ "错误原因:"+xmlDom.parseError.reason); } } } xmlDom.load("demo.xml");
2.适用于火狐和新版本的opera的浏览器支持load()方法加载外部xml文件
//load方法只适用于firefox和新版本opera浏览器 function loadxml(){ //创建xmlDom对象(dom2级xml) var xmlDom = document.implementation.createDocument("","root",null); //获取xml标签的内容2种方法 //alert(xmlDom.documentElement.tagName) //alert(xmlDom.getElementsByTagName("root")[0].tagName); //注意:dom2级不能通过简易的字符串创建文档。 //通过load()方法加载外部项目了文件。注意同步异步 /*//同步加载 xmlDom.async=false; xmlDom.load("City.xml"); //载入外部xml文件,dom2级没有.xml来序列化 alert(xmlDom.getElementsByTagName("City")[0].tagName); alert(xmlDom.getElementsByTagName("Description")[0].firstChild.nodeValue); alert(xmlDom.getElementsByTagName("Description")[0].textContent); //获取属性值 alert(xmlDom.getElementsByTagName("City")[0].getAttribute("Name")); */ //异步加载,使用xmlDom调用onload即可 xmlDom.async = true; xmlDom.onload=function(){ alert(xmlDom.getElementsByTagName("Description")[0].textContent); alert(xmlDom.getElementsByTagName("City")[0].getAttribute("Name")); } xmlDom.load("City.xml"); }
3.模拟loadXml()方法,可以使用简易创建的xml字符串(new DomParser()对象),多数浏览器支持
function dome(){ //模拟loadXml()方法,可以使用简易创建的xml字符串 var xmlParser = new DOMParser(); //创建DOMParser对象 var xmlStr = "<root><user Name=‘aaa‘>Cao</user></root>"; var xmlDom = xmlParser.parseFromString(xmlStr,"text/xml"); alert(xmlDom.getElementsByTagName("user")[0].getAttribute("Name")); alert(xmlDom.getElementsByTagName("user")[0].textContent); //模拟.xml序列化字符串 var serializer = new XMLSerializer(); var xml = serializer.serializeToString(xmlDom); var errors = xmlDom.getElementsByTagName("user"); if(errors.length==0){ //执行后续代码,例如 alert(xml); }else{ throw new Error("错误信息:"+errors[0].textContent); } } dome();
4.多浏览器访问xml字符串,非xml文件
function demo(xmlStr){ var xmlParser = new DOMParser(); var xmlDom=null; if(typeof window.DOMParser!=‘undefined‘){ xmlDom = xmlParser.parseFromString(xmlStr,"text/xml"); var errors = xmlDom.getElementsByTagName("parsererror"); if(errors.length>0){ throw new Error("错误信息:"+errors[0].textContent); } }else if(typeof window.ActiveXObject!=‘undefined‘){ //IE9版本以内的MSXML库有以下三个版本,不同的版本使用不同的库。 var version = [ ‘MSXML2.DomDocument6.0‘, ‘MSXML2.DomDocument3.0‘, ‘MSXML2.DomDocument‘ ]; for(var i=0;i<version.length;i++){ try { //创建加载xml的执行者 var xmlDom = new ActiveXObject(version); } catch (e) { } } xmlDom.loadXML(xmlStr); if(typeof xmlDom.parseError!=0){ throw Error("错误信息:"+xmlDom.parseError.reason); } return xmlDom; }else{ throw Error("您的系统或浏览器不支持XML DOM对象"); } return xmlDom; } var xmlStr = "<root><user>Cao<user></root>"; var xmlDom = demo(xmlStr); alert(xmlDom);
5.适用jQusery加载xml文件
$(function(){ $.ajax({ url:‘city.xml‘, type:‘GET‘, dataType:‘xml‘, timeout:1000, cache:false, error:function(xml){ alert("加载文件出错!"); }, success:getXmlDom }); }); function getXmlDom(xml){ var d = $(xml).find("City"); for(var i=0;i<d.length;i++){ var name = $(d[i]).attr("Name"); var text = $(d[i]).children("Description").text(); } }
//load方法只适用于firefox和新版本opera浏览器function loadxml(){//创建xmlDom对象(dom2级xml)var xmlDom = document.implementation.createDocument("","root",null);//获取xml标签的内容2种方法//alert(xmlDom.documentElement.tagName)//alert(xmlDom.getElementsByTagName("root")[0].tagName);//注意:dom2级不能通过简易的字符串创建文档。//通过load()方法加载外部项目了文件。注意同步异步/*//同步加载xmlDom.async=false;xmlDom.load("City.xml"); //载入外部xml文件,dom2级没有.xml来序列化alert(xmlDom.getElementsByTagName("City")[0].tagName);alert(xmlDom.getElementsByTagName("Description")[0].firstChild.nodeValue);alert(xmlDom.getElementsByTagName("Description")[0].textContent);//获取属性值alert(xmlDom.getElementsByTagName("City")[0].getAttribute("Name"));*///异步加载,使用xmlDom调用onload即可xmlDom.async = true;xmlDom.onload=function(){alert(xmlDom.getElementsByTagName("Description")[0].textContent);alert(xmlDom.getElementsByTagName("City")[0].getAttribute("Name"));}xmlDom.load("City.xml"); }
function dome(){//模拟loadXml()方法,可以使用简易创建的xml字符串var xmlParser = new DOMParser();//创建DOMParser对象var xmlStr = "<root><user Name=‘aaa‘>Cao</user></root>";var xmlDom = xmlParser.parseFromString(xmlStr,"text/xml");alert(xmlDom.getElementsByTagName("user")[0].getAttribute("Name"));alert(xmlDom.getElementsByTagName("user")[0].textContent);//模拟.xml序列化字符串var serializer = new XMLSerializer();var xml = serializer.serializeToString(xmlDom);var errors = xmlDom.getElementsByTagName("user");if(errors.length==0){//执行后续代码,例如alert(xml);}else{throw new Error("错误信息:"+errors[0].textContent);}}dome();
js加载xml文件xin