浏览器中XML DOM的支持

IE中通过ActiveXObject实现了XML的支持，存在一下几个版本：
Microsoft.XmlDom，MSXML2.DOMDocument，MSXML2.DOMDocument.3.0，MSXML2.DOMDocument.4.0，MXXML2.DOMDocument.5.0

IE678使用ActiveXObject来实现XML支持，可以通过loadXML()来传入XML字符串；
在现代浏览器下通过document.implementation.createDocument来实现XML支持，
反序列化需要通过DOMParse对象以及parseFromString方法来完成。

对于载入文档完成后的事件触发，IE678使用的是onreadystatechange事件以及判断readyState属性来得知状态；
对于现代浏览器使用的是onload事件。

对于一个XML对象，IE678提供了xml属性序列化；
对于现代浏览器，需要(new XMLSerializer).serializeToString来序列化。

如上分析，想要实现兼容，
可以通过document.prototype.loadXML来实现现代浏览器的loadXML兼容；
可以通过ES5的Object.defineProperty来定义现代浏览器的readyState属性，在set为4的时候触发onreadystatechange事件；
可以通过ES5的Object.defineProperty来定义现代浏览器的xml属性，读取的时候通过XMLSerializer对象来序列化。

不考虑异常和错误，测试代码如下：

 <!DOCTYPE html>

 <html>

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <style rel="stylesheet" type="text/css">

 </style>

 <script type="text/javascript">

 function createXMLDOM() {

     if(!createXMLDOM.cache){

         // 现代浏览器分支.

         if(document.implementation && document.implementation.createDocument){

             createXMLDOM.cache=function(){

                 var xmldom=document.implementation.createDocument("","",null);

                 // 兼容onreadystatechange方法.

                 _fix_onreadystatechange.call(xmldom);

                 // 添加一个触发事件.

                 xmldom.addEventListener("load",function(){

                     // 设置readyState为4.被动触发onreadystatechange事件.

                     this.readyState=4;

                 },false);

                 return xmldom;

             };

             // 兼容loadXML方法.

             _fix_loadXML();

             // 兼容xml属性

             _fix_xml();

             return createXMLDOM.cache();

         }

         // IE678分支.

         else if(window.ActiveXObject){

             var vs=["MSXML2.DOMDocument.5.0","MSXML2.DOMDocument.4.0",

             "MSXML2.DOMDocument.3.0","MSXML2.DOMDocument",

             "Microsoft.XmlDom"];

             for(var i=0,j=vs.length;i<j;i++){

                 try{

                     var oxmldom=new ActiveXObject(vs[i]);

                     createXMLDOM.cache=new Function("x","return new ActiveXObject('"+vs[i]+"');");

                     return oxmldom;

                 }

                 catch(ex){}

             }

         }

         // 都不兼容.

         else{

             createXMLDOM.cache=new Function("return null;");

             return null;

         }

     }

     else{

         return createXMLDOM.cache();

     }

 }

 /* loadXML的兼容处理.现代浏览器. */

 function _fix_loadXML(){

     Document.prototype.loadXML=function(sxml){

         var oparse=new DOMParser();

         var oxmldom=oparse.parseFromString(sxml, "text/xml");

         while(this.firstChild){

             this.removeChild(this.firstChild);

         }

         for(var i=0,j=oxmldom.childNodes.length;i<j;i++){

             // 获取另一个文档的某个节点以及所有子节点.

             var onewnode=this.importNode(oxmldom.childNodes[i],true);

             // 添加到该文档中.

             this.appendChild(onewnode);

         }

         // 这里修正readyState属性.

         this.readyState=4;

     };

 }

 /* 处理onreadystatechange的兼容. */

 function _fix_onreadystatechange(){

     if(Object.defineProperty){

         Object.defineProperty(this,"readyState",{

             get:function(){

                 return this.__readyState__;

             },

             set:function(i){

                 this.__readyState__=i;

                 this.onreadystatechange();

             }

         });

     }

 }

 /* 现代浏览器需要通过DOMParser对象并通过parseFromString来转换XML文档为字符串 */

 function _fix_xml(){

     // ES5新特性.

     if(Object.defineProperty){

         Object.defineProperty(Node.prototype,"xml",{

             get:function(){

                 return (new XMLSerializer).serializeToString(this,"text/xml");

             }

         })

     }

     // 如下分支IE9开始不支持了.非W3C标准.

     //else if(Node.prototype.__defineGetter__){

     //    Node.prototype.__defineGetter__("xml",function(){

     //        return (new XMLSerializer).serializeToString(this,"text/xml");

     //    });

     //}

 }

 /* 测试 */

 window.onload=function(){

     var xml1=createXMLDOM();

     var xml2=createXMLDOM();

     xml2.onreadystatechange=function(){

         // 这里不能用this.因为在处理ActiveX对象可能出现问题.

         if(xml2.readyState==4){

             document.body.innerHTML+="load xml ok<br/>";

         }

     }

     xml2.loadXML("<xml><blog>xf_z1988</blog></xml>");

     var xml_str=xml2.xml.replace(/</g,"&lt;").replace(/>/g,"&gt;");

     document.body.innerHTML+=xml_str;

 };

 </script>

 </head>

 <body></body>

 </html>

JavaScript XML 兼容处理，序列化和反序列化以及回调事件的更多相关文章

  1. XML和JSON序列化以及反序列化

    1.将文件保存序列化至文档中,然后再读取: //首先创建可序列化的实体类 [Serializable] public class Message { public string Name { get; ...

  2. xml对象的序列化和反序列化

    对象序列化: /// <summary>        /// 将一个对象序列化为XML字符串        /// </summary>        /// <par ...

  3. javascript下的json 序列化及反序列化

    1.序列化 将json对象转为字符串: JSON.stringify(jsonObj) 2.反序列化 var jsonObj = eval("(" + jsonstring + & ...

  4. javascript中的JSON序列化与反序列化

    简单粗暴上代码: function create() { this.name = "jack"; this.sex = "man"; } create.prot ...

  5. Javascript中JSON的序列化和反序列化（转）

    parse用于从一个字符串中解析出JSON对象,如: var str = '{"name":"easonjim","age":"2 ...

  6. C#的XML序列化及反序列化

    webservice在工作中用到的很多,基本都是以XML格式问通讯内容,其中最关键的就是XML串的序列化及反序列化. XML的运用中有两种信息传递,一种为XML的请求信息,另一种为返回信息,要运用XM ...

  7. C# Note4:XML序列化和反序列化（含加密解密等）

    前言 在项目中,我们经常用到各种配置文件,比如xml文件.binary文件等等,这里主要根据实践经验介绍下xml文件的序列化和反序列化(毕竟最常用). 实践背景:我要做一个用户管理功能,用户账号信息存 ...

  8. C# 序列化和反序列化 详解

    什么是序列化以及如何实现序列化? 如何将对象数据写入 XML 文件? 如何从 XML 文件读取对象数据? 什么是序列化以及如何实现序列化? 序列化是通过将对象转换为字节流,从而存储对象或将对象传输到内 ...

  9. Protostuff序列化和反序列化

    序列化和反序列化是在应对网络编程最常遇到的问题之一. 序列化就是将Java Object转成byte[]:反序列化就是将byte[]转成Java Object. 这里不介绍JDK serializab ...

随机推荐

  1. OC基础-day06

    #pragma mark - Day06_01_点语法 1. 点语法. 1). 如果要访问对象的属性,还要去调用属性对应的setter getter方法.好烦躁好烦躁. 2). 点语法的作用: 快速调 ...

  2. UIAlertController使用的一个坑

    / // 创建一个确定按钮”一定要注意不能在提醒控制器的按钮的点击方法内部用到提醒控制器自己”,不能把下面这句话放在block内部”不然会死循环,导致警告控制器不能销毁" UITextFie ...

  3. 分享一个在PearOS里面的plank的配置文件

    plank的配置文件的路径是/home/pear/.config/plank/dock1/settings #This file auto-generated by Plank. #2013-09-0 ...

  4. [转]看看国外的javascript题目,你能全部做对吗?

    叶小钗 的博客最近都在讨论面试题目 正好以前也看过一篇,就借花献佛拿出来分享一下 http://perfectionkills.com/javascript-quiz/ 附带了自己的理解,答案有争议的 ...

  5. Java小例子（学习整理）-----学生管理系统-控制台版

    1.功能介绍: 首先,这个小案例没有使用数据库,用集合的形式暂时保存数据,做测试! 功能: 增加学生信息 删除学生信息 修改学生信息 查询学生信息:  按照学号(精确查询)  按照姓名(模糊查询) 打 ...

  6. 解决Oracle clob字段数据过大问题

    select * from user_lobs where table_name='WX_MAIL';--SYS_LOB0001313121C00015$$ MB FROM user_segments ...

  7. CentOS6.3安装VBoxAdditions

    yum update kernel yum install kernel-devel gcc gcc-c++

  8. C#程序：如何创建xml文件以及xml文件的增、删、改、查

    其实今天的这篇博文 ,是对请几天发表的博文的一个总结,只是想把xml文件的增删改查结合起来,这样更容易让初学的朋友理解,废话也不多说了,开始吧! 下面是我把我在vs环境下写的代码ctrl+V然后ctr ...

  9. learn-python3

    # learn-python3   这是我初学Python时写的一套Python基础示例程序.主要基于廖雪峰老师的Python3教程和<<深入理解Python>>. 感谢! 下 ...

  10. Android Studio与Genymontion的安装

    需要安装的软件: VirtualBox 5.1.4 Genymotion 2.7.2 Android Studio 2.1.2 安装步骤: 使用安装版安装Android Studio 1.     执 ...