Javascript XSLT 处理XML文件(IE and Firefox)

最新推荐文章于 2025-07-31 10:21:42 发布

最新推荐文章于 2025-07-31 10:21:42 发布 · 184 阅读

文章标签：

#IE #XML #Firefox #JavaScript #XSL #ViewUI

HTML 专栏收录该内容

12 篇文章

订阅专栏

本文介绍了一个使用 JavaScript 和 XSLT 处理 XML 文件的具体案例。通过一个包含 CD 信息的 XML 文件和相应的 XSLT 文件，演示了如何在浏览器环境中将 XML 数据转换为 HTML 格式。

javascript xslt 处理xml备忘录。支持firefox。
参考：
w3school XSLT - 客户端 http://www.w3school.com.cn/xsl/xsl_client.asp
如何使用Javascript XSLT 处理XML文件 http://java.chinaitlab.com/advance/533787.html

1.xml文件，cdcatalog.xml

<? xml version="1.0" encoding="ISO-8859-1" ?>

< catalog >
     < cd >
         < title > Empire Burlesque </ title >
         < artist > Bob Dylan </ artist >
         < country > USA </ country >
         < company > Columbia </ company >
         < price > 10.90 </ price >
         < year > 1985 </ year >
     </ cd >
     < cd >
         < title > Hide your heart </ title >
         < artist > Bonnie Tyler </ artist >
         < country > UK </ country >
         < company > CBS Records </ company >
         < price > 9.90 </ price >
         < year > 1988 </ year >
     </ cd >
</ catalog >

2.xsl文件，cdcatalog.xsl

<? xml version="1.0" encoding="ISO-8859-1" ?>

< xsl:stylesheet version ="1.0"
xmlns:xsl ="http://www.w3.org/1999/XSL/Transform" >
< xsl:output method ='html' version ='1.0' encoding ='UTF-8' indent ='yes'/>

<xsl:template match ="/" >
   < html >
   < body >
   < h2 > My CD Collection </ h2 >
     < table border ="1" >
       < tr bgcolor ="#9acd32" >
         < th align ="left" > Title </ th >
         < th align ="left" > Artist </ th >
       </ tr >
       < xsl:for-each select ="catalog/cd" >
       < tr >
         < td >< xsl:value-of select ="title" /></ td >
         < td >< xsl:value-of select ="artist" /></ td >
       </ tr >
       </ xsl:for-each >
     </ table >
   </ body >
   </ html >
</ xsl:template >
</ xsl:stylesheet >

3.html文件，index.html

< html >
< body >

< script type ="text/javascript" >
var xml;
var xsl;
if ( typeof window.ActiveXObject != 'undefined') {
    xml = new ActiveXObject( " Microsoft.XMLDOM " );
    xsl = new ActiveXObject( " Microsoft.XMLDOM " );
} else if (document.implementation && document.implementation.createDocument) {     // mozilla
    xml = document.implementation.createDocument( "" , "" , null );
    xsl = document.implementation.createDocument( "" , "" , null );
}
// Load XML

xml.async = false ;
xml.load( " cdcatalog.xml " );

// Load XSL

xsl.async = false ;
xsl.load( " cdcatalog.xsl " );

// Transform

if ( typeof window.ActiveXObject != 'undefined') {
    document.write(xml.transformNode(xsl));
} else if (document.implementation && document.implementation.createDocument) {     // mozilla
     var xsltProcessor = new XSLTProcessor();
    xsltProcessor.importStylesheet(xsl);
     // transformToDocument方式
     var result = xsltProcessor.transformToDocument(xml);
     var xmls = new XMLSerializer();
    document.write(xmls.serializeToString(result));
}

</ script >

</ body >
</ html >