Let's jump straight into an XSL stylesheet and see how it can
transform an XML document into an HTML file. This is books.xsl:
<?xml version="1.0"?>
<xsl:stylesheet
xmlns:xsl="http://www.w3.org/TR/WD-xsl">
<xsl:template match="/">
<HTML>
<BODY>
<xsl:for-each select="Library/Book">
<B><xsl:value-of select="Title"
/></B><BR/>
<I><xsl:value-of select="ISBN"
/></I><BR/>
<xsl:value-of select="Synopsis" /><BR/>
<A>
<xsl:attribute name="href">
<xsl:value-of select="URL" />
</xsl:attribute>
<xsl:value-of select="URL" />
</A>
<BR/><BR/>
</xsl:for-each>
</BODY>
</HTML>
</xsl:template>
</xsl:stylesheet>
Now, load up the XML file we had earlier, using Microsoft
Internet Explorer 5:

As you can see, if you don't specify a stylesheet in your XML
file, IE5 will automatically use the default stylesheet and display
the XML data in hierarchical format. Let's add a reference to the
XSL stylesheet in the XML file:
<?xml version="1.0" ?>
<?xml:stylesheet type="text/xsl" href="books.xsl"?>
<Library>
Here, I've specified a processing instruction to indicate that
this XML file should use the books.xsl stylesheet. Refresh the XML
file loaded in IE5, and you'll see that the page is formatted
nicely:

How It Works
Let's now take a closer look at the XSL stylesheet, and see how
it transforms the XML source into an HTML file (XHTML, to be
technically accurate). The first thing you should notice is that
XSLT is an application of XML:
<?xml version="1.0" ?>
XSLT has elements that can be used to transform an XML file to
the designated markup language. I'll introduce the XSLT elements
that I use in this paper as I go along; they all have the following
syntax:
<xsl:element>
An <xsl:stylesheet> element defines the set of templates
to be applied to the input source tree to generate the output
source tree. The xmlns attribute defines an XML namespace:
<xsl:stylesheet
xmlns:xsl="http://www.w3.org/TR/WD-xsl">
An <xsl:template> element defines a template for the
output:
<xsl:template match="/">
The value of the match attribute is used to match against the
XML source. In this instance, "/" matches against the root node of
the XML source, and so the template is applied to that root node
and everything inside it.
Since I'm generating a HTML file, we begin by specifying the
beginning of the HTML document in the XSL stylesheet:
<HTML>
<BODY>
This will be inserted as is into the output document.
I need to extract all the information enclosed by the
<Book> element in the XML file. The <xsl:for-each>
element performs a loop, similar to that found in typical
programming languages. The select attribute specifies the XSL
pattern to be matched against the XML source:
<xsl:for-each select="Library/Book">
The value of the select attribute "Library/Book" indicates that
the processor should "look for any Book elements that are
descendants of the Library element in the XML source". This element
essentially loops through all the Book elements within the Library
element.
Once the match is completed, I will use an <xsl:value-of>
element to extract the value of the attribute defined in the XML
source (which in this case is a <Book> element). The select
attribute matches the element defined in the XML file. The value
requested is then returned as text, which is inserted into the
template:
<B><xsl:value-of select="Title"
/></B><BR/>
<I><xsl:value-of select="ISBN"
/></I><BR/>
<xsl:value-of select="Synopsis" /><BR/>
To create a hyperlink in the target markup language (HTML in our
case), I will use an <xsl:attribute> element. In our case,
what I actually want is
<A href="www.wrox.com/3129">www.wrox.com/3129</A>.
<A>
<xsl:attribute name="href">
<xsl:value-of select="URL" />
</xsl:attribute>
<xsl:value-of select="URL" />
</A>
This will insert an href HTML element into the code. As we saw
previously, we could also do this by hard coding the value into the
text.
Lastly, we have the closing tag for the <xsl:for-each>
element:
</xsl:for-each>
And the final closing tags for the HTML and XSLT tags:
</BODY>
</HTML>
</xsl:template>
</xsl:stylesheet>