兼容Firefox的Javascript XSLT 处理XML文件


Posted in Javascript onDecember 31, 2014

最近使用Firefox进行网页的调试,发现有些Javascript XSLT处理XML的语句仅仅支持IE浏览器。而网络中的一些介绍javascript XSLT 处理XML的文章基本上都是依据AJAX来做的。

    无奈中,自己写了一个Javascript XSLT处理XML展现页面的小功能。现在帖出来和大家共享,希望大家给点改进意见。
    在Firefox中使用XSLTProcessor对象处理XML,主要使用该对象的两个方法:
一、transformToFragment()。

二、transformToDocument()。

    下面的代码仅仅使用transformToFragment()方法来实现对XML文件处理,如果你对在Firefox中使用Javascript XSLT 处理XML文件感兴趣的话不妨试着将以下代码改写成使用transformToDocument()方法来实现的处理功能。
Javascript 代码如下:
 

function initialize() {

    var xmlDoc;

    var xslDoc;
    // 判断浏览器的类型

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

    {        

        // 支持Mozilla浏览器

        try

        {

            xmlDoc = document.implementation.createDocument("", "", null);    

            xmlDoc.async = false;

            xmlDoc.load("guestbook/guestbook.xml");

        }

        catch(e)

        {

            alert("error:001");

        }

        try

        {

            xslDoc = document.implementation.createDocument("", "", null);

            xslDoc.async = false;     

              xslDoc.load("guestbook/guestbook.xsl");

              

          }

          catch(e)

          {

              alert("error:002");

          }

          try

          {

              // 定义XSLTProcessor对象    

            var xsltProcessor = new XSLTProcessor();

            xsltProcessor.importStylesheet(xslDoc);

            var oResultFragment = xsltProcessor.transformToFragment(xmlDoc,document);

            // 将解析过的文本输出到页面

            var oDiv = document.getElementById("guestbookPanel");

            oDiv.appendChild(oResultFragment);

        }

        catch(e)

        {

            alert("error:003");

        }    

    }

    else if(typeof window.ActiveXObject != 'undefined')

    {        

        //var xmlDoc=Server.CreateObject("Msxml2.DOMDocument.4.0");        

        // 支持IE浏览器

        xmlDoc = new ActiveXObject('Microsoft.XMLDOM');

        xslDoc = new ActiveXObject('Microsoft.XMLDOM'); 

        xmlDoc.async = false;

        xslDoc.async = false;     

        xmlDoc.load("guestbook/guestbook.xml");

          xslDoc.load("guestbook/guestbook.xsl");

        guestbookPanel.innerHTML = xmlDoc.documentElement.transformNode(xslDoc);    

    }

    else

    {

        alert("Browser unknown!");

    }

}

javascript dom 处理XSL显示数据的第二种方式。

主要代码如下:

var xmlDoc;

 var xslDoc;

 // 判断浏览器的类型

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

 {  

  // 支持Mozilla浏览器

  try

  {

   xmlDoc = document.implementation.createDocument("", "", null); 

   xmlDoc.async = false;

   xmlDoc.load("guestbook/guestbook.xml");

   xslDoc = document.implementation.createDocument("", "", null);

   xslDoc.async = false;  

     xslDoc.load("guestbook/guestbook.xsl");     

     // 定义XSLTProcessor对象 

   var xsltProcessor = new XSLTProcessor();

   xsltProcessor.importStylesheet(xslDoc);

    // transformToDocument方式

    var result = xsltProcessor.transformToDocument(xmlDoc);

    var xmls = new XMLSerializer();

    document.getElementById("guestbookPanel").innerHTML = xmls.serializeToString(result);

  }

  catch(e)

  {

   alert("Unable to do xml/xsl processing");

  } 

 }

 else if(typeof window.ActiveXObject != 'undefined')

 {

  try

  {

   // 支持IE浏览器

   xmlDoc = new ActiveXObject('Msxml2.DOMDocument');

   xslDoc = new ActiveXObject('Msxml2.DOMDocument'); 

   xmlDoc.async = false;

   xslDoc.async = false;  

   xmlDoc.load("guestbook/guestbook.xml");

     xslDoc.load("guestbook/guestbook.xsl");

   guestbookPanel.innerHTML = xmlDoc.documentElement.transformNode(xslDoc);

  }

  catch(e)

  {

   alert("Unable to do xml/xsl processing");

  }

 }

 else

 {

  alert("Browser unknown!");

 }
Javascript 相关文章推荐
表单内同名元素的控制
Nov 22 Javascript
Javascript实例教程(19) 使用HoTMetal(2)
Dec 23 Javascript
常见的jQuery选择器汇总
Nov 24 Javascript
javascript实现十秒钟后注册按钮可点击的方法
May 13 Javascript
javascript数据结构之二叉搜索树实现方法
Nov 25 Javascript
javascript中eval解析JSON字符串
Feb 27 Javascript
微信小程序 Toast自定义实例详解
Jan 20 Javascript
AngularJS2中一种button切换效果的实现方法(二)
Mar 27 Javascript
JS实现网页抢购功能(触发,终止脚本)
Nov 27 Javascript
解决vue侦听器watch,调用this时出现undefined的问题
Oct 30 Javascript
vue实现标签云效果的示例
Nov 09 Javascript
Ajax是什么?Ajax高级用法之Axios技术
Apr 21 Javascript
使用jquery+CSS实现控制打印样式
Dec 31 #Javascript
浅谈javascript中字符串String与数组Array
Dec 31 #Javascript
jQuery中[attribute!=value]选择器用法实例
Dec 31 #Javascript
JavaScript中的Primitive对象封装介绍
Dec 31 #Javascript
JavaScript中的值类型转换介绍
Dec 31 #Javascript
javascript实现滑动解锁功能
Dec 31 #Javascript
JavaScript中number转换成string介绍
Dec 31 #Javascript
You might like
jquery ready()的几种实现方法小结
2010/06/18 Javascript
JavaScript 模式之工厂模式(Factory)应用介绍
2012/11/15 Javascript
JS兼容浏览器的导出Excel(CSV)文件的方法
2014/05/03 Javascript
浅析JavaScript基本类型与引用类型
2014/05/28 Javascript
jquery trigger实现联动的方法
2016/02/29 Javascript
canvas知识总结
2017/01/25 Javascript
js控制一个按钮是否可点击(可使用)disabled的实例
2017/02/14 Javascript
基于JS实现仿百度百家主页的轮播图效果
2017/03/06 Javascript
Vue中fragment.js使用方法详解
2017/03/09 Javascript
jQuery动态产生select option下拉列表
2017/03/15 Javascript
node操作mysql数据库实例详解
2017/03/17 Javascript
JS实现简单的天数计算器完整实例
2017/04/28 Javascript
去掉vue 中的代码规范检测两种方法(Eslint验证)
2018/03/21 Javascript
结合Vue控制字符和字节的显示个数的示例
2018/05/17 Javascript
JavaScript学习笔记之DOM操作实例分析
2019/01/08 Javascript
微信小程序实现拍照画布指定区域生成图片
2019/07/18 Javascript
python杀死一个线程的方法
2015/09/06 Python
python入门基础之用户输入与模块初认识
2016/11/14 Python
python利用Guetzli批量压缩图片
2017/03/23 Python
Python cookbook(数据结构与算法)保存最后N个元素的方法
2018/02/13 Python
python-tkinter之按钮的使用,开关方法
2019/06/11 Python
使用python实现unix2dos和dos2unix命令的例子
2019/08/13 Python
Python3将jpg转为pdf文件的方法示例
2019/12/13 Python
Python安装与卸载流程详细步骤(图解)
2020/02/20 Python
Python-jenkins 获取job构建信息方式
2020/05/12 Python
基于Python爬虫采集天气网实时信息
2020/06/05 Python
Scrapy中如何向Spider传入参数的方法实现
2020/09/28 Python
多重CSS背景动画实现方法示例
2014/04/04 HTML / CSS
美国设计师精美珠宝购物网:Netaya
2016/08/28 全球购物
实习生的自我鉴定范文欣赏
2013/11/20 职场文书
单位刻章介绍信范文
2014/01/11 职场文书
村干部承诺书
2014/03/28 职场文书
县人大领导班子四风对照检查材料思想汇报
2014/10/09 职场文书
雾霾停课通知
2015/04/24 职场文书
win10键盘驱动怎么修复?Win10键盘驱动修复小技巧
2022/04/06 数码科技
Java 常见的限流算法详细分析并实现
2022/04/07 Java/Android