How to output HTML file from XML and XSLT stylesheet

36,286

Solution 1

You can either run XSL transforms in the "normal way" using Javascript API, or use an xml-stylesheet processing instruction, like this:

Load this in to your browser...

<?xml version="1.0"?>
<?xml-stylesheet href="demo.xslt" type="text/xsl"?>
<data>
    <first>first</first>
    <second>second</second>
</data>

and the stylesheet, save this as demo.xslt in the same dir as the XML file

<?xml version="1.0"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
    <xsl:output method="html"/>
    <xsl:template match="/">
        <html>
            <head><title>Xslt browser demo</title></head>
            <body>
                    Here's my data:
                <xsl:for-each select="/data/*"><b><xsl:value-of select="."/></b></xsl:for-each>
            </body>
        </html>
    </xsl:template>
</xsl:stylesheet>

This works for me in Firefox on Linux.

Solution 2

Following is a java code which is used to create the HTML file.When you will run execute this code the out.html file will be created.

package xslt;

import javax.xml.parsers.*;
import org.w3c.dom.*;
import javax.xml.transform.*;
import javax.xml.transform.dom.*;
import javax.xml.transform.stream.*;
import java.io.*;


class XSLT {
    public static void main ( String argv[] ) throws Exception {
    File stylesheet = new File("xslt-example.xsl");
    File xmlfile  = new File("SigmodRecord.xml");
    DocumentBuilderFactory dbf = DocumentBuilderFactory.newInstance();
    DocumentBuilder db = dbf.newDocumentBuilder();
    Document document = db.parse(xmlfile);
    StreamSource stylesource = new StreamSource(stylesheet);
    TransformerFactory tf = TransformerFactory.newInstance();
    Transformer transformer = tf.newTransformer(stylesource);
    DOMSource source = new DOMSource(document);
    //The Html output is in out.html
    StreamResult result = new StreamResult("out.html");
    transformer.transform(source,result);
    }
}

Solution 3

Dimitre's answer is what you need. But here you have an example:

XML:

<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="stylesheet.xsl"?>
<document>
  ...
</document>

Opening the preceding XML document in any (not really but you get it...) browser and it will transform the XML document with stylesheet.xsl and display the result.

It's actully quite a mess when it comes to transformations in browsers imo, bad support and only XSLT 1.0. The MIME type text/xsl is not even "correct" but it's the one most commonly supported by browsers. The correct MIME type should be application/xslt+xml but that's not supported in any (?) browser to my knowledge. See Alejandros comment below.

Solution 4

My question is, what are the actual "mechanics" of getting the XSLT processor (which, I understand, is built in to all web browsers) to read the XML and XSLT stylesheet files and output the HTML document, which will then display on the browser?

It is the task of the specific HTML browser being used to invoke its XSLT processor. Then the browser interpretes the results of the XSLT transformation as the HTML that should be displayed. Do note that in general browsesers are not required to support XSLT pre-processing, so there may exist browsers that do not have an associated XSLT processor and do not honor the xml-stylesheet PI for the type="text/xsl" pseudo-attribute.

For more information read the W3C spec on "Associating Style Sheets with XML Documents"

To test the XSLT transformation in this, somewhat primitive way, you can open the XML file with your browser (do your homework and learn how to open a local file from the browser) and examine the results with a "View Source" or similar command.

I certainly do not recommend this primitive technique. It is much better to use one of the many existing XSLT IDEs, such as the XSelerator, oXygen, Visual Studio, ..., etc.

Share:
36,286
Jack
Author by

Jack

Updated on December 01, 2021

Comments

  • Jack
    Jack over 2 years

    I've created a XML data document and an XSLT stylesheet, and I want to output an HTML document based on the two. My stylesheet has the tag, and my XML document has the processor instuction (along with various "xsl:value-of" references). My question is, what are the actual "mechanics" of getting the XSLT processor (which, I understand, is built in to all web browsers) to read the XML and XSLT stylesheet files and output the HTML document, which will then display on the browser? The XML book that I've been reading doesn't specify this! Thank you

    • Dimitre Novatchev
      Dimitre Novatchev over 13 years
      Good question, +1. See my answer for an explanation.
  • Jack
    Jack over 13 years
    Thanks for your response. But let's say I want to do a "test" on my local computer to see the html document outputted by the browser. How would I do that?
  • Dimitre Novatchev
    Dimitre Novatchev over 13 years
    This is a different question. Please ask a new question. This new question has nothing to do with XSLT: you just need to open the file in your browser using File--> Open, or whatever is the menu sequence for opening a file in the specific browser.
  • Jack
    Jack over 13 years
    No, my question is related, but I just don't think I was clear in my wording. My question was, let's say I have an XML file and an associated XSLT stylesheet, and I want to input these files to the browser to test the HTML file that it will display. How would I do that? Thank you.
  • Dimitre Novatchev
    Dimitre Novatchev over 13 years
    @Jack: My answer now includes the testing information you asked for in your comments.
  • Admin
    Admin over 13 years
    actually, there is no MIME type for XSLT. application/xslt+xml was the proposal in XSLT 2.0 WD. So, test/xml or application/xml (for purist) are the correct MIME type for sending XSLT stylesheets. The type pseudo attribute of xml-stylesheet PI is just to determine between test/css and test/xsl.
  • Per T
    Per T over 13 years
    @Alejandro: You're right, I haven't updated myself apperantly or read some old stuff. Sorry for that and thanks for the clarification!