Introduction to XSLT

Last updated October 16, 2019

I've just moved hosting companies and not all functions work on this page yet.

This page is for people who know XML well, and would like a brief overview of what XSLT can do. View this page as series of slides

Preview During this session we will explore the following topics:
1. What is XSL?
2. What is the syntax?
3. How much power does it offer us?
4. What is its realtionship to SQL?
Introduction
XSLT is an acronym of "Extensible Stylesheet Language Transformations". XSLT is easily confused with Cascading Style Sheets (CSS). CSS is concerned about presentation of data, while XSLT is used for creating new documents by rearranging and filtering xml data. XSLT can make multiple passes over a document.

The Big Idea

XSL Transformations convert an XML document to another format. In the process we do fun things like rearrange the elements, prune some data, and add text before and after elements.

For example, Given an XML document like this:

<fruits>
<fruit name="apple" quantity="3" />
<fruit name="pears" quantity="5" />
</fruits>

We can convert this information to an HTML table that looks like this:

<html>
<body>
<h1>Fruit Inventory</h1>
<table border="1">
<tr><th>Name</th><th>Quantity</th></tr>
<tr><td>apple</td><td>3</td></tr>
<tr><td>pears</td><td>5</td></tr>
</table>
</body>
</html>

The following XSLT file tells us how to convert the XML to something else, in this case an HTML file. It may look like greek now, but we'll learn what it means soon.

<?xml version="1.0"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html>
<body>
<h1>Fruit Inventory</h1>
<table border="1">
<tr><th>Name</th><th>Quantity</th></tr>
  <xsl:apply-templates select="*" />
</table>
</body>
</html>
</xsl:template>

<!-- templates -->
  <xsl:template match="fruit">
<tr><td> <xsl:value-of select="@name" /> </td><td> <xsl:value-of select="@quantity" /> </td></tr>
  </xsl:template>

</xsl:stylesheet>

How do we convert to the HTML table from the XML file and an XSLT style sheet? We can do this in a few different ways. One is in programs written in something like C#, which I'll show you later. An easier way is to let your browser do it for you by adding a style sheet reference. This works for most modern browsers.

<?xml version='1.0' encoding='utf-8' ?>
<?xml-stylesheet type="text/xsl" href="simpleExample.xslt"?>
<fruits>
<fruit name="apple" quantity="3" />
<fruit name="pears" quantity="5" />
</fruits>

If you enter http://www.fincher.org/tips/web/xslt/simpleExample2.xml into a browser window it will load the above file and make the transformation for you.

XPath
From the w3.org definition: XPath is the result of an effort to provide a common syntax and semantics for functionality shared between XSL Transformations [XSLT] and XPointer [XPointer]. The primary purpose of XPath is to address parts of an XML [XML] document. In support of this primary purpose, it also provides basic facilities for manipulation of strings, numbers and booleans.

The return value of an XPath expression may be a node set, string, integer, or boolean value.

XPath typically operates on three types of nodes, Element nodes, attribute nodes, and text nodes.

XPath "Location Paths"

A "location step" selects a set of nodes relative to the context node and has the general format of

axis::node-test[predicate]*

Example:

child::Country[@name='US']

The "axis" is one of the following:

Axis	Abbreviation	Description
child	(empty string)	All the direct children (no grandchildren, attribute nodes, or namespaces)
descendant	//	All the children (no attribute nodes or namespaces)
parent	..	the immediate parent
ancestor		all the nodes above this one until the root is reached
following-sibling		all siblings after current node
preceding		all sibling before this node
following		all the nodes after this one, but not its descendents
preceding		all the nodes before this one (no ancestors, attributes, or namespaces)
attribute	@	all the attribute nodes for this node
namespace		namespaces nodes of the context node
self	.	the context node itself
descendant-or-self		all descendents and self
ancestor-or-self		all ancestors and self

'node-test' typically is the name of an element (e.g., employee, salary, city)
'predicate' is an XPath expression that (ultimately) evaluates to a boolean value or oddly enough to an integer (e.g., [position() = last()]

XPath expressions
1. Node Set Functions
  Examples: last(), position(), count()
2. String Functions
  Examples: starts-with(), contains(), string-length(),
3. Boolean Functions
  Examples: not, true, false
4. Number Functions
  Examples: number(), sum(), floor(), ceiling(), round() ,or, and, =, != ,<=, <, >=, >, mod
  Note about boolean expressions. In xpath the literals "and" and "or" are used as conjunctions, not "&&" and "||".
Location Path
A "location path" consists of one or more location steps separated by "/". : Examples from w3.org:
1. child::para selects the para element children of the context node
2. child::* selects all element children of the context node
3. child::text() selects all text node children of the context node
4. child::node() selects all the children of the context node, whatever their node type
5. attribute::name selects the name attribute of the context node
6. attribute::* selects all the attributes of the context node
7. descendant::para selects the para element descendants of the context node
8. ancestor::div selects all div ancestors of the context node
9. ancestor-or-self::div selects the div ancestors of the context node and, if the context node is a div element, the context node as well
10. descendant-or-self::para selects the para element descendants of the context node and, if the context node is a para element, the context node as well
11. self::para selects the context node if it is a para element, and otherwise selects nothing
12. child::chapter/descendant::para selects the para element descendants of the chapter element children of the context node
13. child::*/child::para selects all para grandchildren of the context node
14. / selects the document root (which is always the parent of the document element)
15. /descendant::para selects all the para elements in the same document as the context node
16. /descendant::olist/child::item selects all the item elements that have an olist parent and that are in the same document as the context node
17. child::para[position()=1] selects the first para child of the context node
18. child::para[position()=last()] selects the last para child of the context node
19. child::para[position()=last()-1] selects the last but one para child of the context node
20. child::para[position()>1] selects all the para children of the context node other than the first para child of the context node
21. following-sibling::chapter[position()=1] selects the next chapter sibling of the context node
22. preceding-sibling::chapter[position()=1] selects the previous chapter sibling of the context node
23. /descendant::figure[position()=42] selects the forty-second figure element in the document
24. /child::doc/child::chapter[position()=5]/child::section[position()=2] selects the second section of the fifth chapter of the doc document element
25. child::para[attribute::type="warning"] selects all para children of the context node that have a type attribute with value warning
26. child::para[attribute::type='warning'][position()=5] selects the fifth para child of the context node that has a type attribute with value warning
27. child::para[position()=5][attribute::type="warning"] selects the fifth para child of the context node if that child has a type attribute with value warning
28. child::chapter[child::title='Introduction'] selects the chapter children of the context node that have one or more title children with string-value equal to Introduction
29. child::chapter[child::title] selects the chapter children of the context node that have one or more title children
30. child::*[self::chapter or self::appendix] selects the chapter and appendix children of the context node
31. child::*[self::chapter or self::appendix][position()=last()] selects the last chapter or appendix child of the context node

Templates

Using XSLT is primary composed of writing "Templates" and then applying them. A template has the general form of:

<xsl:template
  match = pattern
  name = qname
  priority = number
  mode = qname>
  <!-- Content: (xsl:param*, template) -->
</xsl:template>

Example:

  <xsl:template match="title">
     <br /> title <u><xsl:value-of select="." /></u>
  </xsl:template>

Applying Templates

Templates are then called (much like a function) by an "apply-templates" element.

<xsl:apply-templates
  select = node-set-expression
  mode = qname>
  <!-- Content: (xsl:sort | xsl:with-param)* -->
</xsl:apply-templates>

Example:

<xsl:apply-templates select="bookquotes/book/title" />

Book Quote Examples:

The following examples will all use the "bookquotes.xml" data file. This file contains a favorite quote from books I've read, along with information about the book.

<bookquotes>

<book isbn="0201835959" type="nonfiction" date="01/06/1975">
<title>The Mythical Man-Month</title>
<author>Fred Brooks</author>
<quote> The programmer, like the poet, works only slightly removed from pure
thought-stuff.  He builds his castles in the air, from air, creating
by exertion of the imagination.</quote>
<page>7</page>
</book>

<book isbn="0140260404" type="nonfiction" date="11/01/1996">
<title>The Road Ahead</title>
<author>Bill Gates</author>
<quote>"Success is a lousy teacher."</quote>
</book>

<book isbn="068483068X" type="fiction" date="01/01/1936">
<title>Gone with the Wind</title>
<author>Margaret Mitchell</author>
<quote>"Never pass up new experiences [Scarlett], They enrich the mind."  - Rhett Butler</quote>
<quote>"Southerners can never resist a losing cause." - Rhett Butler</quote>
<quote>"But, no matter what sights they [the defeated Southern aristocracy] had seen,
what menial tasks they had done and would have to do, they remained ladies and
gentlemen, royalty in exile..."</quote>
</book>

</bookquotes>

A simple xsl file bookquotes1.xslt to create a simple list of the book titles

<?xml version="1.0"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template name='test' match="/">
<!-- write the xhtml template -->
<html>
<head>
  <title>Book Quotes - Index of Titles</title>
  <link href="http://fincher.org/mystyle.css" rel="stylesheet" type="text/css" />
</head>
<body>
<h1>Book Quotes - Index of Titles</h1>

<xsl:apply-templates select="bookquotes/book/title" /> <!-- this will search for templates -->
</body>
</html>
</xsl:template>

<!-- templates -->
  <xsl:template match="title">
  <!-- 'value-of select="."' will select the text between the xml tags for the current node -->
     <br /> title <u><xsl:value-of select="." /></u>
  </xsl:template>
</xsl:stylesheet>

Applying the above stylesheet to our xml datafile results in the following transformation.

Using xsl:variables to avoid repeating data

I hate to have the same text twice in a file, like in the title and h1 header, so lets use the xslt:variable element and only define it once, so it won't get out of sync.

<?xml version="1.0"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:variable name="title">Book Quotes - Index of Titles</xsl:variable>

<xsl:template name='test' match="/">
<html>
<head>
  <title><xsl:value-of select="$title"/></title>
  <link href="http://fincher.org/mystyle.css" rel="stylesheet" type="text/css" />
</head>
<body>
<h1><xsl:value-of select="$title"/></h1>
<xsl:apply-templates select="bookquotes/book/title" />
</body>
</html>
</xsl:template>

<!-- templates -->
  <xsl:template match="title">
     <br /> title: <u><xsl:value-of select="." /></u>
  </xsl:template>
</xsl:stylesheet>