graphic with four colored squares
Cover page images (keys)

Overview of XSLT and XPath

24 Aug 2005

Ivan Herman, W3C

Overview of XSLT and XPath

Slides of the presentation …

(If your browser has proper implementation of the object element of XHTML (e.g., Mozilla’s Firefox) and you have a SVG plugin installed, you might want to use the same slideset using SVG. Some of the images may have added interaction and they also rescale better…)

Table of Contents:

  1. Styling XML
  2. XML and CSS
  3. XSL
  4. XSLT+XPath by themselves
  5. Our test example
  6. XML Content as a Tree
  7. XSLT Transformation
  8. XSLT Structure
  9. Template Body
  10. More complete XSLT for the CDs
  11. Aatabou, Najat
  12. Alternative XSLT style for CDs
  13. More templates for push
  14. Result of various XSLT-s for CDs
  15. Different types of output
  16. Example
  17. (Some) XSLT Elements
  18. Example: Sorting
  19. Example: Choose
  20. Some More Features of XSLT
  21. XPath
  22. XPath (cont.)
  23. XPath Nomenclature
  24. Axes
  25. Location Step
  26. Some Special Node Tests
  27. Location Path
  28. Examples for Location Paths
  29. Predicates
  30. Functions
  31. Who sings 'Sweet Lorraine'?
  32. Miscellaneous on XPath
  33. The Future
  34. Some Changes in XPath 2.0
  35. Some Changes in XSLT 2.0
  36. Conclusion

Styling XML

XML and CSS

XSL

XSLT+XPath by themselves

Our test example

Extract from a CD collection in XML:

<cd>
  <artist>Aatabou, Najat</artist>
  <title>The Voice of the Atlas</title>
  <catalog>CDORBD 069</catalog>
  <time>61.15</time>
  <filed>C05 World</filed>
  <playlist>
    <work>Baghi narajah</work>
    <work>Finetriki</work>
    <work>Shouffi rhirou</work>
    <work>Lila ya s'haba</work>
    <work>Ouardatte lajnane</work>
    <work>Ditih</work>
  </playlist>
</cd>

XML Content as a Tree

A tree representation of a simple XML Content

XSLT Transformation

A conceptual drawing of a transformation: input an xml content and and xslt file, output an xml file again

XSLT Structure

   <xsl:template match="/">
     <html>
      ...
     </html>
   </xsl:template>

Template Body

  <xsl:template match="/">
    <html>
      ...
      <xsl:for-each select="cd/artist">
        <h3>Artist</h3>
        <p> <xsl:value-of select="." /></p>
      </xsl:for-each>
    </html>
  </xsl:template>
  1. Process all artist nodes that are subnodes of cd nodes
  2. Output is an h3 heading
  3. Generate a paragraph
  4. Output the string value of the current node (ie, the artist's name)

More complete XSLT for the CDs

<xsl:template match="/">
  <xsl:for-each select="cdlist/cd">
   <H1><xsl:value-of select="artist"/></H1>
   <hr />
   <p class="01"><xsl:value-of select="title" /></p>
   <p class="02">Label:<xsl:value-of select="label"/>
                
     Number:<xsl:value-of select="catalog"/>
                
     Time:<xsl:value-of select="time"/></p>
   <p class="03">Stored at:<xsl:value-of select="filed"/></p>
   <p class="04">Playlist:</p>
   <ul>
     <xsl:for-each select="playlist/work">
       <li class="05"><xsl:value-of select="." /></li>
     </xsl:for-each>
   </ul>
  </xsl:for-each>
  <hr />
</xsl:template>

This is referred to as a “pull” model (all patterns are pulled into the root template)

Aatabou, Najat

The Voice of the Atlas

Label: , Number: CDORBD 069 , Time: 61.15

Stored at: C05 World

Playlist:

Alternative XSLT style for CDs

Template pushes nodes out to be handled by other templates:

    <xsl:template match="/">
      <xsl:for-each select="cdlist/cd">
        <xsl:apply-templates/>
      </xsl:for-each>
    </xsl:template>

Ie, look for the other templates starting by the current context (already handled)

More templates for push

<xsl:template match="artist">
  <H1 class="emph1"> <xsl:value-of select="."/></H1>
</xsl:template>
<xsl:template match="title">
  <p class="01"><xsl:value-of select="."/></p>
</xsl:template>
<xsl:template match="label">
  <p class="02">Label:<xsl:value-of select="."/> </p>
</xsl:template>
  ...
<xsl:template match="filed">
  <p class="05">Stored at:<xsl:value-of select="."/></p>
</xsl:template>
<xsl:template match="playlist">
  <p class="06">Playlist:</p>
  <ul>
    <xsl:for-each select="work">
      <li style="..."><xsl:value-of select="."/></li>
    </xsl:for-each>
  </ul>
</xsl:template>

Result of various XSLT-s for CDs

You can generate many different output styles from the same dataset

For example:

Such technique is of a vital importance in:

Different types of output

Example

Use:

 <xsl:output
    method="xml" version="1.0" indent="yes"
    omit-xml-declaration="no" encoding="utf8"
    doctype-public="-//W3C//DTD SVG 20010904//EN"
    doctype-system="...DTD/svg10.dtd"
    media-type="image/svg+xml"/>

to get:

  <?xml version="1.0" encoding="utf8"?>
  <!DOCTYPE svg
     PUBLIC "-//W3C//DTD SVG 20010904//EN"
     SYSTEM "...DTD/svg10.dtd">

(Some) XSLT Elements

XSLT Element Description
xsl:apply-templates Finds correct template to apply
xsl:template Defines a template
xsl:element Generates an element
xsl:attribute Generates attribute node
xsl:value-of Evaluates select and outputs value
xsl:text Generates text literaly
xsl:copy and xsl:copy-of Shallow/deep copy of a node
xsl:choose Conditional testing
xsl:for-each Cycle based on test
xsl:if Conditional test
xsl:sort Sort the elements

Example: Sorting

   <xsl:for-each select="cdlist/cd" >
     <xsl:sort select="title" />
    ...
   </xsl:for-each >

CDs ordered by title

Example: Choose

Goal: colour code the different types of CD

    <tbody>
      <xsl:for-each select="cdlist/cd">
       <tr>
         <xsl:attribute name="style">color:
           <xsl:choose>
             <xsl:when test="filed[. = 'C05 World']">lime</xsl:when>
             <xsl:when test="filed[. = 'C06 Country']">yellow</xsl:when> 
             <xsl:when test="filed[. = 'C11 Jazz Trad']">orange</xsl:when>
             <xsl:when test="filed[. = 'C01 Pop']">red</xsl:when>
             <xsl:otherwise>white</xsl:otherwise>
           </xsl:choose>
         </xsl:attribute>
         <td><xsl:value-of select="artist"/></td>
         <td><xsl:value-of select="title"/></td>
         <td><xsl:value-of select="filed"/></td>
       </tr>
      </xsl:for-each>
    </tbody>

It tests the content of the element "filed" to set the style

Some More Features of XSLT

XPath

   <xsl:for-each select="cdlist/cd[filed = 'C06 Country']" >

XPath (cont.)

XPath Nomenclature

XPath Nomenclature

Axes

Location Step

     child::para[position()=1]
     para[position()=1]

Some Special Node Tests

Location Path

Examples for Location Paths

/doc/chapter[3]/section
*/para
//svg//style

Predicates

     para[@type="main"][3]
     employee[@secretary and @assistant]

Functions

    <xsl:if test="number(substring(.,5,2))=25">

Who sings 'Sweet Lorraine'?

Example for the usage of axes in XSLT:

<xsl:for-each select="cdlist/cd/work">
  <xsl:choose>
    <xsl:when test=". = 'Sweet Lorraine'" >
      <td>
        <xsl:value-of select="ancestor::cd/artist"/>
      </td>
    </xsl:when>
  </xsl:choose>
</xsl:for-each>

Miscellaneous on XPath

The Future

Some Changes in XPath 2.0

element(*,datatype)
for $a in fn:somefilter(/bib/book/author) return ($a/title)

Some Changes in XSLT 2.0

Conclusion

XSLT+XPath

It is around, use it!