web analytics

Test XSLT transformation in HTML Page

Options

codeling 1595 - 6639
@2017-09-11 15:57:18

The following HTML file can be used to try the XSLT transformation and see the results.

<html>
  <head>
    <title></title>
  </head>
  <body onload="init()">
     <div><input type="text" id="xmlName" value="text.xml"></div>
     <div><input type="text" id="xslName" value="text.xsl"></div>
     <div><input type=button value="transform" onclick="trans();"></div>
     <div id="divErr"></div>
     <pre id="preRes" style="background:blue;color:gold"></pre>
  </body>

  <script language="javascript">
    function trans()
    {
      xmlFile=xmlName.value;
      xslFile=xslName.value;
      if (xmlFile == "" || xslFile == "")
      {
         divErr.innerHTML = "invalid xml/xsl file names.";
      }

      var xsl = new ActiveXObject("MSXML2.DOMDOCUMENT.6.0");
      var xml = new ActiveXObject("MSXML2.DOMDocument.6.0");
      xml.validateOnParse = false;
      xml.async = false;
      xml.load(xmlFile);
      if (xml.parseError.errorCode != 0)
        divErr.innerHTML = "XML Parse Error : " + xml.parseError.reason;

      xsl.async = false;

      xsl.resolveExternals = true;

      xsl.load(xslFile);
      if (xsl.parseError.errorCode != 0)
        divErr.innerHTML = "XSL Parse Error : " + xsl.parseError.reason;

      try
      {
        res = xml.transformNode(xsl.documentElement);
        preRes.innerText = res;
      }
      catch(err)
      {
        divErr.innerHTML = "Transformation Error:"
               +err.number+"*"+err.description;
      }
    }
  </script>
</html>

@2017-09-11 16:01:10

Copy the sample code into appropriate files, and save the files to your local drive, such as text.html

Create your text.xml and text.xsl files in the same local drive

Double-click your HTML file, text.html.

Click the transform button on the Web page that appears.

XML file sampel (text.xml)

<?xml version="1.0"?>
<topic>
  <item>First line.</item>
  <item>Second line.</item>
  <item></item>
</topic>

XSLT file sample (text.xsl)

<?xml version='1.0'?>
<xsl:stylesheet version="1.0"
      xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
  <xsl:output method="text"/>

  <xsl:template match="/">
    <xsl:apply-templates/>
  </xsl:template>

  <xsl:template match="item">
    "<xsl:value-of select="."/>"
  </xsl:template>
</xsl:stylesheet>

Comments

You must Sign In to comment on this topic.


© 2024 Digcode.com