Styling the XML with XSLT - Page 14
November 4, 2002
We'll create a new stylesheet,
xml2html_3.xsl,
to transform our XML file. Change the first line for XSL-WD
if you need to, as described above (you can find the XSL-WD-friendly version
in the code download too,
as xml2html_ie5_3.xsl).
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<xsl:apply-templates />
</xsl:template>
<xsl:template match="text()"
/>
<xsl:template match="dinosaurs">
<html>
<head>
<title>A simple HTML
page</title>
<style type="text/css">
body { font-family: Verdana,
Times, Serif; }
</style>
</head>
<body>
<table style="border: solid
thin black">
<tr>
<td><a
href="mammoth.html">Visit the Mammoth zone!</a> - </td>
<td><a
href="play.html">Play Pteranodon Poker</a></td>
</tr>
</table>
<h1>My
big list of dinosaurs</h1>
<xsl:apply-templates
/>
<hr/>
Copyright 2002 DinosaurOrg.
</body>
</html>
</xsl:template>
<xsl:template
match="dinosaur">
<h2><xsl:value-of
select="@name"/></h2>
<xsl:value-of
select="description/text()"/>
<ul>
<xsl:apply-templates/>
</ul>
</xsl:template>
<xsl:template
match="weight">
<li><b>Weight:
</b><xsl:value-of select="text()" /> tons</li>
</xsl:template>
<xsl:template
match="length">
<li><b>Length:
</b><xsl:value-of select="text()" /> m</li>
</xsl:template>
<xsl:template
match="color">
<li><b>Color:
</b><xsl:value-of select="text()" /></li>
</xsl:template>
</xsl:stylesheet>
The beginning of this stylesheet looks remarkably like our previous example
except that, rather than searching for a <body> element,
we instead search for the <dinosaurs>
element. Because our XML file contains no HTML at all, the stylesheet has
to include the <html> and <head> elements in its transformation
this time round. Likewise, the template for the <dinosaurs> element must close the <html> element at the bottom of the page.
Rather than search for an <h2>
tag to find out our individual dinosaur names, this stylesheet searches for
the <dinosaur> element and
references its name parameter. This
is much better than the previous approach of matching the <h2>
tag, as you may have other <h2>
tags in your document that don't refer to dinosaurs.
<xsl:template
match="dinosaur">
<h2><xsl:value-of
select="@name"/></h2>
<xsl:value-of
select="description/text()"/>
<ul>
<xsl:apply-templates/>
</ul>
</xsl:template>
The @name reference on line 2 of
this section points to the value of the name attribute of the <dinosaur> tag, transforming<dinosaur name="Tyrannosaurus Rex">
into <h2>Tyrannosaurus Rex</h2>.
The description/text() reference on line 3 then points to the text contents
of the <description> child
element for our current <dinosaur>
element. <xsl:apply-templates
/> then tells the XSLT processor to apply any templates to the contents
of the <dinosaur> element –
in this case, <weight>, <length>,
and <color>. We have defined templates for
these three tags, and so they are translated by their templates into the same
HTML code as in our previous examples.
Example 3: Separating Design from Content - Page 13
Practical XML for the Web
Removing Content with XSLT - Page 15
|
