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 相关文章推荐
encode脚本和normal脚本混用的问题与解决方法
Mar 08 Javascript
cookie.js 加载顺序问题怎么才有效
Jul 31 Javascript
js实现的早期滑动门菜单效果代码
Aug 27 Javascript
JS+CSS实现仿msn风格选项卡效果代码
Oct 22 Javascript
JS实现页面载入时随机显示图片效果
Sep 07 Javascript
微信小程序 less文件编译成wxss文件实现办法
Dec 05 Javascript
详解Angular4中路由Router类的跳转navigate
Jun 09 Javascript
简单的Vue异步组件实例Demo
Dec 27 Javascript
利用SpringMVC过滤器解决vue跨域请求的问题
Feb 10 Javascript
使用Vue自定义指令实现Select组件
May 24 Javascript
使用pm2部署node生产环境的方法步骤
Mar 09 Javascript
layui实现form表单同时提交数据和文件的代码
Oct 25 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容易被忽略而出错陷阱 数字与字符串比较
2011/11/10 PHP
php中$_POST与php://input的区别实例分析
2015/01/07 PHP
修改Laravel5.3中的路由文件与路径
2016/08/10 PHP
PHP两种实现无级递归分类的方法
2017/03/02 PHP
Extjs407 getValue()和getRawValue()区别介绍
2013/05/21 Javascript
基于 Docker 开发 NodeJS 应用
2014/07/30 NodeJs
点击button获取text内容并改变样式的js实现
2014/09/09 Javascript
Json实现异步请求提交评论无需跳转其他页面
2014/10/11 Javascript
js实现从中间开始往上下展开网页窗口的方法
2015/03/02 Javascript
JS/Jquery判断对象为空的方法
2015/06/11 Javascript
浅谈node.js中async异步编程
2015/10/22 Javascript
快速学习jQuery插件 jquery.validate.js表单验证插件使用方法
2015/12/01 Javascript
JavaScript 函数的定义-调用、注意事项
2017/04/16 Javascript
Js利用Canvas实现图片压缩功能
2017/09/13 Javascript
写给小白看的JavaScript异步
2017/11/29 Javascript
Vue项目使用localStorage+Vuex保存用户登录信息
2019/05/27 Javascript
webpack自动打包和热更新的实现方法
2019/06/24 Javascript
vue下使用nginx刷新页面404的问题解决
2019/08/02 Javascript
从零学Python之hello world
2014/05/21 Python
在Python中操作时间之tzset()方法的使用教程
2015/05/22 Python
Python中使用platform模块获取系统信息的用法教程
2016/07/08 Python
利用python爬取斗鱼app中照片方法实例
2017/12/03 Python
django框架模型层功能、组成与用法分析
2019/07/30 Python
pytorch在fintune时将sequential中的层输出方法,以vgg为例
2019/08/20 Python
安装PyInstaller失败问题解决
2019/12/14 Python
如何理解Python中的变量
2020/06/01 Python
Python while true实现爬虫定时任务
2020/06/08 Python
Lenox官网:精美的瓷器&独特的礼品
2017/02/12 全球购物
英国领先的体验日提供商:Buyagift
2019/04/19 全球购物
会务接待方案
2014/02/27 职场文书
公司总经理助理岗位职责
2014/07/09 职场文书
教师辞职信范文
2015/02/28 职场文书
干部培训简讯
2015/07/20 职场文书
工程主管竞聘书
2015/09/15 职场文书
大学班干部竞选稿
2015/11/20 职场文书
MIME类型中application/xml与text/xml的区别介绍
2022/01/18 HTML / CSS