js操作XML文件的实现方法兼容IE与FireFox


Posted in Javascript onJune 25, 2016

最近项目中用到了xml,需求是用户安装产品时先把一系列的数据保存到xml文件中,当执行到最后一步时才写入数据库,这样最大限度的减少了数据库的访问,于是不得不纠结在各浏览器的兼容性的问题(悲哀啊....)

进入正文 下面是一个xml文件 (createInstal.xml)

<?xml version="1.0" encoding="utf-8"?>
<info>
<Item>
<id descrption="级别" name="1" f_chines="编号" t_chines="??" english="id" value="1">编号</id>
<levelname descrption="级别" name="" f_chines="级别名称" t_chines="??e名?" english="Level-Name" value="级别一">级别名称</levelname>
<decrption descrption="级别" name="" f_chines="级别描述" t_chines="??e描述" english="Level-Description" value="级别描述一">描述</decrption>
<Tchines descrption="级别" name="" f_chines="繁体中文" t_chines="繁?中文" english="T-Chinese" value="??e一">繁体中文</Tchines>
<english descrption="级别" name="" f_chines="英文名称" t_chines="英文名?" english="English" value="LevelOne">英文名称</english>
<奖项六 descrption="奖项" name="106" f_chines="奖项六" t_chines="??六" english="Worda-of-t" value="a"/>
<奖项十一 descrption="奖项" name="111" f_chines="奖项十一" t_chines="??十一" english="11" value="0.05"/>
<奖项十二 descrption="奖项" name="112" f_chines="奖项十二" t_chines="??十二" english="2222" value="0.04"/>
<奖项十三 descrption="奖项" name="113" f_chines="奖项十三" t_chines="??十三" english="3333" value="0.85"/>
<奖项一 descrption="奖项" name="101" f_chines="奖项一" t_chines="??一" english="Aword-of-a" value="0.90"/>
</Item> 
</info>

为了能兼容IE与FF,写如下几个函数(loadxml.js):

var is_Ie =false; //是否为IE浏览器
if (window.ActiveXObject) {
is_Ie =true;
}
//加载多浏览器兼容的xml文档
function loadXml(xmlUrl) {
var xmldoc =null;
try {
xmldoc =new ActiveXObject("Microsoft.XMLDOM");
}
catch (e) {
try {
xmldoc = document.implementation.createDocument("", "", null);
} catch (e) {
alert(e.message);
}
}
try {
//关闭异步加载
xmldoc.async =false;
xmldoc.load(xmlUrl);
return xmldoc;
}
catch (e) {
alert(e.message);
}
returnnull;
}
//将一个xml文档格式的字符串换成xml文档
function createXml(xmlText) {
if (!xmlText) {
returnnull;
try {
var xmldocm =new ActiveXObject("Microsoft.XMLDOM");
xmldocm.loadXML(xmlText);
return xmldocm;
}
catch (e) {
try {
returnnew DOMParse().parseFromString(xmlText, "text/xml");
}
catch (e) {
returnnull;
}
}
}
}
//获取节点及其子节点的文本
function getXmlText(oNode) {
if (oNode.text) {//IE
return oNode.tex;
}
var sText ="";
for (var i =0; i < oNode.childNodes.length; i++) { //遍历子节点
if (oNode.childNodes[i].hasChildNodes()) { //是否有子节点
sText += getXmlText(oNode.childNodes[i]);
} else {
sText += oNode[i].childNodes.nodeValue;
}
}
return sText;
}

//获取节点及其子节点的字符串标识
function getXml(oNode) {
if (oNode.xml) {//IE
return oNode.xml;
}
var serializer =new XMLSerializer();
return serializer.serializeToString(oNode);

}
//获取指定节点的文本(注意:也可以用oNode.childNodes[0].nodeValue来获取节点的文本信息,这样就不用考虑浏览器的问题了oNodeoNode)
function getxmlnodeText(oNode) {
if (is_Ie) {
return oNode.text;
} else {
if (oNode.nodeType ==1)
return oNode.textContent;
}
}
//获取指定节点的属性值
function getxmlnodeattribute(oNode, attrName) {
if (is_Ie) {
return oNode.getAttribute(attrName);
} else {
if (oNode.nodeType ==1|| oNode.nodeType =="1")return oNode.attributes[attrName].value;return"undefined";}}

ok  IE与FF 不再是问题,具体的操作方法如下:

var docum = loadxml("createInstal.xml");//加载一个xml文件

var root = docum.documentElement;//根节点

var nodelist = root.getElementsByTagName("Items");

for(var i=0;i<nodelist[0].childNodes.length;i++)

{

var attr = getxmlnodeattribute(nodeList[0].childNodes[i], "descrption");//获取这个节点的descrption属性


if(attr != "undefined")//目的是兼容FF浏览器


{



alert(attr);


}

}

这样就能保证IE与FF的兼容,(目前谷歌浏览器没有办法用这种方法兼容,还待修改)

另外说下FireFox获取xml的两种方法:

firefox中JS读取XML文件

在网上搜“firefox中JS读取XML文件”的方法,找了半天,好 多都是问了没人答的。看到一堆程序员在抱怨firefox:“除了累死程序员没什么好处。”,言归正传。firefox不支持ie中的 ActiveXObject对象,要得到一个XML DOM有以下2种方法:

1、document.implementation.createDocument("", "", null);
2、window.XMLHttpRequest

示例:1、var dom=document.implementation.createDocument("", "", null);

dom.async=false;
dom.load("test.xml");//dom就是xml对象了。

2、var oXmlHttp = new XMLHttpRequest() ;
oXmlHttp.open( "GET", "test.xml", false ) ;
oXmlHttp.send(null) ;
//oXmlHttp.responseXML就是xml对象了。

注意:

1、火狐解析xml文档 

2、火狐浏览器和ie解析xml不一样节点的值用textContent。 

3、并且他会在有的层次child节点(即使用childNodes时)前后都加上"\n"换行符。(这个搞不清楚为什么,用firebug调试的时候就是这个样子,所以写过的代码最好测试一下,换个环境就不对了) ,也就是说第1个节点是"\n",第2个节点才是真正的

第一个节点。  第3个节点是"\n",第4个节点才是真正的第二个节点。

根据上述的火狐的情况,我这里有个例子避免了使用childNodes,而达到兼容性:点击进入

以上就是小编为大家带来的js操作XML文件的实现方法兼容IE与FireFox全部内容了,希望大家多多支持三水点靠木~

Javascript 相关文章推荐
jquery命令汇总,方便使用jquery的朋友
Jun 26 Javascript
JS+CSS实现仿新浪微博搜索框的方法
Feb 24 Javascript
jQuery实现类似标签风格的导航菜单效果代码
Aug 25 Javascript
jQuery无刷新上传之uploadify3.1简单使用
Jun 18 Javascript
设置jquery UI 控件的大小方法
Dec 12 Javascript
angular十大常见问题
Mar 07 Javascript
详解VUE的状态控制与延时加载刷新
Mar 27 Javascript
JavaScript中使用webuploader实现上传视频功能(demo)
Apr 10 Javascript
详解AngularJS1.6版本中ui-router路由中/#!/的解决方法
May 22 Javascript
AngularJS中ng-options实现下拉列表的数据绑定方法
Aug 13 Javascript
详解mpvue中小程序自定义导航组件开发指南
Feb 11 Javascript
javscript 数组扁平化的实现
Feb 03 Javascript
js将滚动条滚动到指定位置的简单实现方法
Jun 25 #Javascript
jQuery图片渐变特效的简单实现
Jun 25 #Javascript
js删除局部变量的实现方法
Jun 25 #Javascript
浅谈JQuery+ajax+jsonp 跨域访问
Jun 25 #Javascript
javascript 广告移动特效的实现代码
Jun 25 #Javascript
jQuery+CSS3文字跑马灯特效的简单实现
Jun 25 #Javascript
解析JavaScript中的字符串类型与字符编码支持
Jun 24 #Javascript
You might like
php防注
2007/01/15 PHP
PHP4和PHP5性能测试和对比 测试代码与环境
2007/08/17 PHP
用PHP与XML联手进行网站编程代码实例
2008/07/10 PHP
discuz论坛 用户登录 后台程序代码
2008/11/27 PHP
PHP 获取文件权限函数介绍
2013/07/11 PHP
php缩放gif和png图透明背景变成黑色的解决方法
2014/10/14 PHP
PHP将Excel导入数据库及数据库数据导出至Excel的方法
2015/06/24 PHP
thinkPHP下ueditor的使用方法详解
2015/12/26 PHP
PHP大文件分割上传 PHP分片上传
2017/08/28 PHP
PHP四种排序算法实现及效率分析【冒泡排序,插入排序,选择排序和快速排序】
2018/04/27 PHP
纯js实现的论坛常用的运行代码的效果
2008/07/15 Javascript
window.ActiveXObject使用说明
2010/11/08 Javascript
js取两个数组的交集|差集|并集|补集|去重示例代码
2013/08/07 Javascript
举例讲解Node.js中的Writable对象
2015/07/29 Javascript
修改Jquery Dialog 位置的实现方法
2016/08/26 Javascript
JavaScript实现时钟滴答声效果
2017/01/29 Javascript
微信小程序 支付功能开发错误总结
2017/02/21 Javascript
Nodejs之TCP服务端与客户端聊天程序详解
2017/07/07 NodeJs
zTree获取当前节点的下一级子节点数实例
2017/09/05 Javascript
微信小程序实现评论功能
2018/11/28 Javascript
python海龟绘图实例教程
2014/07/24 Python
Python中的Classes和Metaclasses详解
2015/04/02 Python
python解决汉字编码问题:Unicode Decode Error
2017/01/19 Python
LRUCache的实现原理及利用python实现的方法
2017/11/21 Python
python中的内置函数max()和min()及mas()函数的高级用法
2018/03/29 Python
Python自定义一个类实现字典dict功能的方法
2019/01/19 Python
解决pycharm安装第三方库失败的问题
2020/05/09 Python
Python+OpenCV图像处理——图像二值化的实现
2020/10/24 Python
Python爬虫之Selenium警告框(弹窗)处理
2020/12/04 Python
canvas离屏技术与放大镜实现代码示例
2018/08/31 HTML / CSS
英国网上超市:Ocado
2020/03/05 全球购物
给幼儿园老师的表扬信
2014/01/19 职场文书
家电业务员岗位职责
2014/03/10 职场文书
2014年话务员工作总结
2014/11/19 职场文书
初级职称评定工作总结
2015/08/13 职场文书
创业计划书之DIY自助厨房
2019/09/06 职场文书