3.3 Outputting HTML

You have seen a few examples that produce HTML output. The following HTML example is more complicated than ones you have seen before. This section covers explicit, presentation-oriented HTML output, discussed in Section 16.2 of the XSLT specification. The XML document, wg.xml (Example 3-1), contains the names of the former and current W3C XML Working Group (WG) members at the time of the publication of the first edition of XML 1.0.

Example 3-1. XML document listing the names of the XML Working Group members
<?xml version="1.0"?>     <!--  names of persons acknowledged as current and past members  of the W3C XML Working Group at the time of the publication  of the first edition of the XML specification on 1998-02-10 -->     <names>  <name>   <last>Angerstein</last>   <first>Paula</first>  </name>  <name>   <last>Bosak</last>   <first>Jon</first>  </name>  <name>   <last>Bray</last>   <first>Tim</first>  </name>  <name>   <last>Clark</last>   <first>James</first>  </name>  <name>   <last>Connolly</last>   <first>Dan</first>  </name>  <name>   <last>DeRose</last>   <first>Steve</first>  </name>  <name>   <last>Hollander</last>   <first>Dave</first>  </name>  <name>   <last>Kimber</last>   <first>Eliot</first>  </name>  <name>   <last>Magliery</last>   <first>Tom</first>  </name> <name>   <last>Maler</last>   <first>Eve</first>  </name>  <name>   <last>Maloney</last>   <first>Murray</first>  </name> <name>   <last>Murata</last>   <first>Makoto</first>  </name>  <name>   <last>Nava</last>   <first>Joel</first>  </name>  <name>   <last>O'Connell</last>   <first>Conleth</first>  </name>  <name>   <last>Paoli</last>   <first>Jean</first>  </name>  <name>   <last>Sharpe</last>   <first>Peter</first>  </name>  <name>   <last>Sperberg-McQueen</last>   <first>C. M.</first>  </name>  <name>   <last>Tigue</last>   <first>John</first>  </name> </names>

The element names last and first fit Western-oriented names, which admittedly is a problem when you are dealing with international names. In other examples in this chapter, last is transformed to family and first is transformed to given, which is more generalized for international names. But because this example is only concerned with presentation-oriented HTML, changing the element names to more descriptive names is extraneous.


Along with the names of the individual in alphabetical order, the document contains an informative comment in the prolog (near the top). You can use the stylesheet wg.xsl, shown in Example 3-2, to transform this document into the HTML shown in Example 3-3.

Example 3-2. A stylesheet to convert the list of members from Example 3-1 into the HTML shown in Example 3-3
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:output method="html" version="4.01"/> <xsl:output doctype-system="http://www.w3.org/TR/html4/strict.dtd"/> <xsl:output doctype-public="-//W3C//DTD HTML 4.01//EN"/>     <xsl:template match="/">  <html>   <head>   <title>Original W3C XML Working Group Members</title>   <style type="text/css">   body {font-family: sans-serif}   h1 {font-size: 20pt}   lu {font-size: 16pt}   </style>   </head>     <body>   <h1>Original W3C XML Working Group Members</h1>   <p>Following are the    <xsl:value-of select="substring(comment(  ),2,string-length(comment(  ))-12)"/>     10 February 1998:</p>    <ul><xsl:apply-templates/></ul>   </body>  </html> </xsl:template>     <xsl:template match="name">   <li><xsl:apply-templates/></li> </xsl:template>     <xsl:template match="last">   <xsl:comment> family name </xsl:comment>   <xsl:apply-templates/><xsl:text>, </xsl:text> </xsl:template>     <xsl:template match="first">   <xsl:comment> given name </xsl:comment>   <xsl:apply-templates/> </xsl:template>     </xsl:stylesheet>

The stylesheet sets the output method to html unambiguously, that is, it does not depend on the default HTML output method. The version attribute indicates the HTML version number. This won't show up in the output, but it is available should any application want the information (rare). The stylesheet will also produce a public and system identifier for HTML 4.01.

The first template matches on the root of the document and starts building the outer layers of an HTML document, including some CSS style rules. Following that, there is an interesting line of gobbledy-gook that I want to draw your attention to:

<xsl:value-of select="substring(comment(  ),2,string-length(comment(  ))-12)"/>

This instance of value-of returns a substring or shortened version of the comment in the prolog by using the substring( ) function. The first argument of the substring( ) function is comment( ), which looks like a function, but it isn't it's something called a node-test (you'll learn about node-tests in Chapter 4). The expression in the select attribute uses substring( ) to subtract 14 characters from the comment 2 characters at the beginning of the comment (skips characters 0 and 1, and starts at character 2) and 12 at the end of the comment.

Processing comments blindly without knowing their exact content will probably result in a good deal of frustration on your part.


The string-length( ) function, which appears as the third argument of the function substring( ), returns the length of the comment (181 characters) and subtracts 12 from 181. This removes the ISO 8601 date from the returned comment and allows the stylesheet to add a differently formatted date (10 February 1998), which is specified as literal text. The returned comment is preceded by the text Following are the. You will learn more about expressions and functions in Chapter 5.

The first template, the one that matches the document root (/), calls apply-templates, which in turn finds the template that reaches each occurrence of the child element name. This name template instantiates the HTML element li (list item) and then calls apply-templates, which finds template rules for its children last and first. The templates for last and first add comments to the result, and the template for last adds a comma. After each template is invoked, it returns control to the template that invoked it. The XSLT processor munches through the whole document until it can't find any more nodes in the source.

Go ahead and process wg.xml with wg.xsl, saving the result to wg.html:

xalan -o wg.html wg.xml wg.xsl

The resulting file wg.html follows in Example 3-3.

Example 3-3. The HTML results of processing Example 3-1 using the XSLT stylesheet shown in Example 3-2
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <META http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Original W3C XML Working Group Members</title> <style type="text/css">   body {font-family: sans-serif}   h1 {font-size: 20pt}   lu {font-size: 16pt}   </style> </head> <body> <h1>Original W3C XML Working Group Members</h1> <p>Following are the     names of persons acknowledged as current and past members  of the W3C XML Working Group at the time of the publication  of the first edition of the XML specification on     10 February 1998:</p> <ul>  <li>   <!-- family name -->Angerstein,   <!-- given name -->Paula  </li>  <li>   <!-- family name -->Bosak,   <!-- given name -->Jon  </li>  <li>   <!-- family name -->Bray,   <!-- given name -->Tim  </li>  <li>   <!-- family name -->Clark,   <!-- given name -->James  </li>  <li>   <!-- family name -->Connolly,   <!-- given name -->Dan  </li>  <li>   <!-- family name -->DeRose,   <!-- given name -->Steve  </li>  <li>   <!-- family name -->Hollander,   <!-- given name -->Dave  </li>  <li>   <!-- family name -->Kimber,   <!-- given name -->Eliot  </li>  <li>   <!-- family name -->Magliery,   <!-- given name -->Tom  </li>  <li>   <!-- family name -->Maler,   <!-- given name -->Eve  </li>  <li>   <!-- family name -->Maloney,   <!-- given name -->Murray  </li>  <li>   <!-- family name -->Murata,   <!-- given name -->Makoto  </li>  <li>   <!-- family name -->Nava,   <!-- given name -->Joel  </li>  <li>   <!-- family name -->O'Connell,   <!-- given name -->Conleth  </li>  <li>   <!-- family name -->Paoli,   <!-- given name -->Jean  </li>  <li>   <!-- family name -->Sharpe,   <!-- given name -->Peter  </li>  <li>   <!-- family name -->Sperberg-McQueen,   <!-- given name -->C. M.  </li>  <li>   <!-- family name -->Tigue,   <!-- given name -->John  </li> </ul> </body> </html>
Figure 3-5. wg.html in Mozilla
figs/lxsl_0305.gif

Figure 3-5 shows what wg.html looks like in Mozilla.

You can easily validate wg.html using Mozilla's built-in link to the W3C Markup Validation Service. To do so, follow these steps:

  1. Choose File Edit Page (or CTRL+E) in Mozilla.

  2. When the Composer window appears, choose Tools Validate HTML.

  3. When the W3C Markup Validation Service window appears, click the Browse button and select wg.html.

  4. Click the button Validate this file.

  5. The successful result should appear as Figure 3-6.

Figure 3-6. W3C Validation Service report on wg.html
figs/lxsl_0306.gif


Learning XSLT
Learning XSLT
ISBN: 0596003277
EAN: 2147483647
Year: 2003
Pages: 164

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net