将XML转换为HTML输出

这是一种非常常见的方法,因为如果遇到不支持XML的浏览器,必须用HTML来保持兼容性.
要使用这种方法,就要利用javascript和DOMDocument对象.

一般的方法:
定义两个DOMDocument对象,一般load xml文档,一个load xsl文档,然后用transformNode进行转换输出.

例子:

ex28.xml

<?xml version="1.0" encoding="gb2312"?>
<!-- 注意这里没有对XSL文件的引用 -->
<CATALOG>
    <CD>
        <TITLE>天空</TITLE>
        <ARTIST>王菲</ARTIST>
        <LANGUAGE>国语</LANGUAGE>
        <COMPANY>福茂唱片</COMPANY>
        <YEAR>1995</YEAR>
        <PRICE>28元</PRICE>
    </CD>
    <CD>
        <TITLE>不老的传说</TITLE>
        <ARTIST>张学友</ARTIST>
        <LANGUAGE>粤语</LANGUAGE>
        <COMPANY>宝丽金</COMPANY>
        <YEAR>1997</YEAR>
        <PRICE>28元</PRICE>
    </CD>
</CATALOG>

ex28.xsl

<?xml version="1.0" encoding="gb2312"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:fo="http://www.w3.org/1999/XSL/Format">
<xsl:template match="/">
    <html>
        <head>
            <title>转换结果</title>
        </head>
        <body>
            <p align="center"><font color="#FF0000" size="5">CD大卖场</font></p>
            <table width="95%" border="1" bgcolor="#00FFFF">
                <tbody>
                    <tr>
                        <td width="20%"><div align="center">专辑名称</div></td>
                        <td width="15%"><div align="center">歌手</div></td>
                        <td width="15%"><div align="center">语言</div></td>
                        <td width="15%"><div align="center">发行公司</div></td>
                        <td width="15%"><div align="center">年份</div></td>
                        <td width="15%"><div align="center">价格</div></td>
                    </tr>
                    <xsl:for-each select="//CD">
                        <tr>
                            <td><div align="center">
                                <xsl:value-of select="TITLE"/>
                            </div></td>
                            <td><div align="center">
                                <xsl:value-of select="ARTIST"/>
                            </div></td>
                            <td><div align="center">
                                <xsl:value-of select="LANGUAGE"/>
                            </div></td>
                            <td><div align="center">
                                <xsl:value-of select="COMPANY"/>
                            </div></td>
                            <td><div align="center">
                                <xsl:value-of select="YEAR"/>
                            </div></td>
                            <td><div align="center">
                                <xsl:value-of select="PRICE"/>
                            </div></td>
                        </tr>
                    </xsl:for-each>
                </tbody>
            </table>
        </body>
    </html>
</xsl:template>
</xsl:stylesheet>

output.html

<html>
   <head>
      <title>转换为HTML</title>
      <meta http-equiv="Content-Type" content="text/html;charset=gb2312"/> 
   </head>
   <XML id="source" src="ex28.xml"/>
   <XML id="stylesheet" src="ex28.xsl"/>
   <script language="javascript">
       function viewxml()
       {
           a.innerText=source.xml;
        }
        function viewxsl()
        {
            a.innerText=stylesheet.xml;
        }
        function change()
        {
            var xmldom=new ActiveXObject("Microsoft.XMLDOM");
            xmldom.load("ex28.xml");
            var xsldom=new ActiveXObject("Microsoft.XMLDOM");
            xsldom.load("ex28.xsl");
            document.write(xmldom.transformNode(xsldom));
        }
   </script>
   <body>
      <p>单击下面三个按钮查看效果</p>
      <p>&nbsp;</p>
      <input name="button1" type="button" value="显示XML文件" onclick="viewxml()"/>
      <input name="button2" type="button" value="显示XSL文件" onclick="viewxsl()"/>
      <input name="button3" type="button" value="显示转换文件" onclick="change()"/>
      <div id="a"></div>
   </body>
</html>

这样输出的HTML就直接用document.write写出转换方法transformNode的返回HTML代码就可以了.

第7章 XSL高级应用相关推荐

  1. 计算机论文word版,计算机应用基础第05章Word高级应用－毕业论文排版

    计算机应用基础第05章Word高级应用-毕业论文排版 (31页) 本资源提供全文预览,点击全文预览即可全文预览,如果喜欢文档就下载吧,查找使用更方便哦! 14.90 积分 5.1.1 任务描述 刘海是 ...

  2. 第九章 模板高级进阶

    2019独角兽企业重金招聘Python工程师标准>>> 第九章 模板高级进阶 虽然大多数和Django模板语言的交互都是模板作者的工作,但你可能想定制和扩展模板引擎,让它做一些它不能 ...

  3. JavaScript核心知识第二章---事件高级（含大量代码分析）

    前言 ❤️ 一个人有多重的才华,骨子里就会刻上多大重量的谦卑 ❤️ JavaScript核心知识第二章---事件高级 一.JavaScript 事件高级 (1)注册事件(绑定事件) 1.1 注册事件概 ...

  4. 【《C Primer Plus》读书笔记】第17章：高级数据表示

    [<C Primer Plus>读书笔记]第17章:高级数据表示 17.1 研究数据表示 17.2 从数组到链表 17.3 抽象数据类型(ADT) 17.4 队列ADT 17.5 用队列进 ...

  5. 《软件测试的艺术》第六章 更高级别的测试

    <软件测试的艺术>第六章 更高级别的测试 6.0 前言 软件开发过程模型 6.1 功能测试 6.2 系统测试 6.2.1 能力测试 6.2.2 容量测试 6.2.3 强度测试 6.2.4 ...

  6. Spring基础专题——第十一章（高级注解编程完结）

    前言:去年到现在一直没有很好的时间完成这个spring基础+源码的博客目标,去年一年比较懒吧,所以今年我希望我的知识可以分享给正在奋斗中的互联网开发人员,以及未来想往架构师上走的道友们我们一起进步,从 ...

  7. 数据基础---《利用Python进行数据分析·第2版》第12章 pandas高级应用

    之前自己对于numpy和pandas是要用的时候东学一点西一点,直到看到<利用Python进行数据分析·第2版>,觉得只看这一篇就够了.非常感谢原博主的翻译和分享. 前面的章节关注于不同类 ...

  8. Java面向对象笔记 • 【第11章 Swing高级应用】

    全部章节   >>>> 本章目录 11.1 JTable表格组件 11.1.1 JTable表格组件 11.1.2 实践练习 11.2 菜单组件 11.2.1 菜单组件 11. ...

  9. 第二章 Redis高级

    第二章:Redis高级 学习目标 目标1:能够说出redis中的数据删除策与略淘汰策略 目标2:能够说出主从复制的概念,工作流程以及场景问题及解决方案 目标3:能够说出哨兵的作用以及工作原理,以及如何 ...

  10. 精通比特 - 第4章，高级密钥和地址

    4.5 高级密钥和地址 在以下部分中,我们将看到高级形式的密钥和地址,诸如加密私钥.脚本和多重签名地址,靓号地址,和纸钱包. 4.5.1 加密私钥(BIP0038) 私钥必须保密.私钥的机密性需求事实 ...

最新文章

  1. Redhat7修改默认运行级别方法
  2. 软件测试功能报告,软件功能测试报告
  3. python标记跳转_Geany的跳转到标记定义“功能如何使用
  4. 装车机器人_智造春天脚步近 青岛这家机器人公司着手打造模块化、标准化技术平台...
  5. 11.19 rpm:RPM包管理器
  6. codeforce 768B Code For 1
  7. css中的单位换算_CSS单位px、em、rem及它们之间的换算关系
  8. REVERSE-COMPETITION-HGAME2022-Week1
  9. 一句话总结重构、重载、重写
  10. bzoj 1620: [Usaco2008 Nov]Time Management 时间管理（贪心）
  11. （转）ICO是区块链与生俱来的特性，是金融深化的终局
  12. html设置按钮不同状态的背景图片,CSS实例:创建一个鼠标感应换图片的按钮
  13. 排队论在计算机和通信领域的应用,随机过程与排队论——及其在计算机领域中的应用.pdf...
  14. layer.prompt输入框改成laydate时间控件
  15. 命令登陆mysql数据库_命令操作Mysql数据库
  16. 计算机类毕业论文中期检查,计算机类毕业论文中期检查表
  17. html页面的dtd是什么意思,html dtd文件解释
  18. jsoup模拟登陆合肥工业大学信息门户
  19. MCS51 系列单片机的中央处理器（CPU）
  20. jsp中div 标签到底有什么用?

热门文章

  1. idea配置java和maven_Maven配置，使用IntelliJ IDEA和Maven创建Java Web项目
  2. MAC编译jogl/gluegen很顺利
  3. 短路主板电源针，启动电脑的办法
  4. Could not initialize English chunker/Could not load file from classpath: ‘/en-token.bin‘
  5. CSDN排名规则变化略谈
  6. 错误解决办法：exec /usr/lib/ssh/ssh-askpass : No such file or directory error.
  7. X86栈切换，任务切换
  8. mysql和memcache 查询_使用Memcache缓存MySQL查询(转载)
  9. extjs 表格数据重新加载_将【金数据】实时获取到Excel的小技能
  10. mysql中regexp用法_MySQL中REGEXP正则表达式使用大全