Javascript轻松实现调用xslt解析xml

最新推荐文章于 2024-07-11 10:52:38 发布

broze

最新推荐文章于 2024-07-11 10:52:38 发布

阅读量2.7k

点赞数

分类专栏： XML 文章标签： javascript xslt xsl xmlhttprequest linq encoding

本文链接：https://blog.csdn.net/broze/article/details/7675782

版权

XML 专栏收录该内容

7 篇文章 1 订阅

订阅专栏

XML代码如下，

<?xml version="1.0" encoding="ISO-8859-1"?>
<rss version="2.0">
<channel>
    <title>C-Sharpcorner Latest Articles</title>
    <link>http://www.c-sharpcorner.com/</link>
    <description>Watch articles from C# Corner</description>
    <copyright>Ã‚Â© 1999 - 2011 Mindcracker LLC. All Rights Reserved</copyright>
    <item>
      <title>Joins Using LINQ in C#</title>
      <description>Today, in this article we will see how to perform join operation using LINQ queries. I have created two tables in database named 'Candidate'. The first table name is Employee. the second table name is Student. I have used LINQ to SQL to communicate with database. </description>
      <link>http://www.c-sharpcorner.com/UploadFile/54db21/joins-using-linq-in-C-Sharp/</link>
      <pubDate>12/13/2011 3:08:33 AM</pubDate>
      <author>Vijay Prativadi</author>
    </item>
    <item>
      <title>Simple Arithmetic Operation using WCF Service Hosted on WebApp</title>
      <description>Today, in this article we will try to perform simple arithmetic operation importing some created service into our web application. Once the application is fully developed we can request values from our web form which retrieve the output by performing an expected operation to the values specified by the service. </description>
      <link>http://www.c-sharpcorner.com/UploadFile/54db21/simple-arithmetic-operation-using-wcf-service-hosted-on-weba/</link>
      <pubDate>12/13/2011 2:41:30 AM</pubDate>
      <author>Vijay Prativadi</author>
    </item>
    <item>
      <title>Print in C#</title>
      <description>Here is a good list of resource related to printing in C# using GDI+.</description>
      <link>http://www.c-sharpcorner.com/UploadFile/mahesh/print-in-C-Sharp/</link>
      <pubDate>12/12/2011 3:19:54 PM</pubDate>
      <author>Mahesh Chand</author>
    </item>
</channel>
</rss>

XSL代码如下，

<?xml version="1.0" encoding="iso-8859-1"?>
<html xsl:version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns="http://www.w3.org/1999/xhtml">
<body style="font-family:Arial,helvetica,sans-serif;font-size:12pt;
        background-color:#EEEEEE">
    <xsl:for-each select="rss/channel/item">
      <tr style="color:#0080FF;">
        <td style="text-align:left;font-weight:bold;">
          <xsl:value-of select ="title"></xsl:value-of>
        </td>
        <td style="text-align:right;font-weight:bold;">
          <i>
            <xsl:value-of select ="author"></xsl:value-of>
          </i>, <xsl:value-of select="pubDate"/>
        </td>
      </tr>
      <tr>
        <td colspan="2" style="text-align:left;padding-top:10px;">
          <xsl:value-of select="description"/>
        </td>
      </tr>
      <tr>
        <td colspan="2" style="text-align:right;">
          <a href="{link}" rel="bookmark">
            More...
          </a>
        </td>
      </tr>
      <tr>
        <td colspan="2" style="height:20px;">
          <hr></hr>
        </td>
      </tr>
    </xsl:for-each>
</body>
</html>

JS代码如下，

<html>
<head>
<script>
function loadXMLDoc(dname)
{
   if (window.ActiveXObject)
   {
       xhttp = new ActiveXObject("Microsoft.XMLHTTP");
   }
   else if (window.XMLHttpRequest)
   {
       xhttp = new XMLHttpRequest();
   }

   xhttp.open("GET",dname,false);
   xhttp.send("");
   return xhttp.responseXML;
}

function displayResult()
{
   xml=loadXMLDoc("a1.xml");
   xsl=loadXMLDoc("b.xsl");
   // code for IE
   if (window.ActiveXObject)
   {
       ex=xml.transformNode(xsl);
       document.getElementById("example").innerHTML=ex;
   }
   // code for Mozilla, Firefox, Opera, etc.
   else if (document.implementation && document.implementation.createDocument)
   {
       xsltProcessor=new XSLTProcessor();
       xsltProcessor.importStylesheet(xsl);
       resultDocument = xsltProcessor.transformToFragment(xml,document);
       document.getElementById("example").appendChild(resultDocument);
   }
}
window.onload = function()
{
      displayResult();
}
</script>
</head>
<body>
<div id="example" />
</body>
</html>