Tip: The zen of XSLT

The fundamental questions when writing XSLT

To start coding an XSLT can be intimidating, but if you can answer two simple questions, you are well on your way. With the simple approach this tip presents and about 10 minutes, you can have a much clearer understanding of the fundamentals of transformations.

Share:

Doug Domeny, Senior Software Engineer, Freelance

Doug Domeny has developed a browser-based, multilingual, business user-friendly XML editor written using XSLT, W3C XML Schema, DHTML, JavaScript, jQuery, regular expressions, and CSS. Holding a bachelor's degree in computer science and mathematics from Gordon College in Wenham, MA, Doug has served for many years on OASIS technical committees such as XML Localization Interchange File Format (XLIFF) and Open Architecture for XML Authoring and Localization (OAXAL). In his roles as a software engineer, he has developed significant skills in software engineering and architecture, UI design, and technical writing.



11 January 2011

Also available in Chinese Japanese

Ten years ago, when XSLT was relatively new, I struggled to understand it. It was too difficult to use and too challenging to debug. After I came to understand the strengths and weaknesses of XSLT and—more importantly—its paradigm and how and when to use it, however, XSLT is now a favorite tool that's a pleasure to use. XSLT is elegant and extremely powerful when applied well to a task for which it is suited.

Frequently used acronyms

  • CSS: Cascading style sheet
  • HTML: Hypertext Markup Language
  • RSS: Really Simple Syndication
  • SQL: Structured Query Language
  • URL: Uniform resource locator
  • W3C: World Wide Web Consortium
  • XHTML: Extensible Hypertext Markup Language
  • XML: Extensible Markup Language
  • XSLT: Extensible Stylesheet Language Transformations

Have you ever used a hammer and screwdriver to loosen a nut from a bolt? You place the screwdriver blade on one side of the hex nut and tap the screwdriver's handle with the hammer. Twist around with the nut as it turns. If it doesn't turn, tap harder. Now consider being given a socket wrench. It looks a little like a hammer, but it's not as effective as using an actual hammer. So, put down the hammer and screwdriver, and place the socket over the nut and turn. Unfortunately, the socket is too large, so you struggle to get it to grip. Eventually, you give up and go back to the hammer.

The key to success with a socket wrench is pattern matching: The socket must match the nut. When it does, a socket wrench is much more effective at loosening a nut from a bolt than a hammer. XSLT also depends on patterns: It's a pattern-matching language, whereas the Java™ and C# languages are imperative languages. If XSLT is a socket wrench, imperative languages are hammers. Each has its use.

XSLT is a programming language

Web development requires a mastery of several very different languages. The first, of course, is HTML—a markup language. Then, add CSS and JavaScript on the front end; server scripts such as PHP or Microsoft® ASP.NET; and a back-end language such as Java, C#, or Microsoft Visual Basic.NET. Finally, at the database level, is SQL. If you know SQL, XSLT is easier to learn because both are declarative languages.

If you're like most programmers, you started your career with an imperative language like C++. These languages are coded by command, and functions perform the actions. Their names take the form verb-noun—for example, GetValue or UpdateContactInfo. Declarative languages are less about issuing commands and more about stating (or declaring) the desired output. Table 1 shows several common programming languages categorized as either imperative or declarative.

Table 1. Programming language styles
ImperativeDeclarative
ProceduralObject-orientedFunctionalLogic
C, PascalJava, C++LISP, XPathProlog, SQL, XSLT

The Zen of XSLT: pattern matching

XSLT is a declarative language for transforming XML to XML, HTML, or plain text. The transform occurs by matching patterns in the input XML that selects a template with the content to output. The key is pattern matching, as in Figure 1. Instead of coding commands, you code patterns. Some patterns match the input, and other patterns act as templates for the output.

Listing 1 shows a simple XSLT template that matches <item> elements.

Listing 1. Example XSLT template
<xsl:template match="item">
     <li><a href="{link}"><xsl:value-of select="title"/></a></li>
</xsl:template>

The match attribute specifies the pattern to match the input—in this case, an <item> tag. The markup between the <xsl:template> tags is the output template. The template has placeholders where values from the input are substituted. In Listing 1, the value of the <link> element provides the URL to the href attribute, and the value of the <title> element is the visible text of the hyperlink.

Often, as a developer, you are given a task, such as "display this RSS feed as a list of links." Figure 1 shows how you might envision the look of the final product.

Figure 1. Rendered output
Rendered HTML output of a list of links

To start coding now, however, would result in frustration, like using a socket wrench with the wrong-sized socket. Before you begin, ask yourself two questions:

  • What do I have (input)?
  • What do I want (output)?

Determining the input for your task

When answering the question of input, consider the following queries:

  • What does the XML look like?
  • What are the elements?
  • Which are repeatable?
  • What is the structure?
  • What are the attributes?
  • What are the namespaces?

Figure 2 shows common terms in XML structure.

Figure 2. Common XML terms
An XML element consists of an opening tag, which can have attributes, child nodes, and a closing tag

Get a sample of the input XML. If available, get the schema, too. The schema provides information on all the possible tags, attribute values, and the structure of the XML document, including optional elements and attributes. The sample input document is essential to coding the matching patterns and testing and debugging your XSLT. For example, consider the IBM® developerWorks®technical library RSS feed in Listing 2.

Listing 2. Sample input XML document
<?xml version="1.0"?> 
<rss version="2.0"> 
<channel> 
    <title>IBM developerWorks : Technical library</title> 
    <link>http://www.ibm.com/developerworks/</link> 
    <description>The latest content from IBM developerWorks</description> 
    <pubDate>27 Nov 2010 16:48:48 +0000</pubDate> 
    <language>en</language> 
    <copyright>Copyright 2004 IBM Corporation.</copyright> 
    <image> 
        <title>developerWorks</title> 
        <url>http://www.ibm.com/developerworks/i/dwlogo-small.gif</url> 
        <link>http://www.ibm.com/developerworks/</link> 
    </image> 

    <item> 
        <title><![CDATA[IBM Cognos Proven Practices: Enterprise Planning - 
User Lockdown in DB2]]></title> 

        <description><![CDATA[This document describes methods to limit 
database permission in DB2 for IBM Cognos Planning 8.]]></description> 

        <link><![CDATA[http://www.ibm.com/developerworks/data/
library/cognos/infrastructure/databases/page535.html?ca=drs-]]></link> 

        <pubDate>25 Nov 2010 05:00:00 +0000</pubDate> 
    </item> 

    <item> 
        <title><![CDATA[Monitoring in DB2 9.7, Part 2: Relational access to 
XML event monitor data in DB2 9.7]]></title> 

        <description><![CDATA[Learn how you can get relational access to 
the subset of monitor data that is captured in the form of an XML document 
by an activity or statistics event monitor in IBM DB2 for Linux, UNIX, and 
Windows Version 9.7 (DB2).]]></description> 

        <link><![CDATA[http://www.ibm.com/developerworks/data/
library/techarticle/dm-1011db2mpart2/index.html?ca=drs-]]></link> 

        <pubDate>24 Nov 2010 05:00:00 +0000</pubDate> 
    </item> 

</channel> 
</rss>

Determine your output

With a good idea of your input, you can turn your mind to what you want the finished product to look like. Ask yourself these questions:

  • Which format should the output be in (XML, HTML, text)?
  • What are the tag names and attributes?
  • What is the structure?

XSLT transforms one or more XML documents into one of the following formats:

  • HTML
  • XML, different vocabulary
  • XML, same vocabulary (use identity templates)
  • XHTML (XML with special considerations)
  • XSLT (XSLT is an XML vocabulary but requires the use of namespace-aliases)
  • Text (for example, JavaScript)

When designing the output markup, start with a vision of how it should look, then take the next step of crafting the markup. For example, Listing 3. shows the HTML markup for a list of hyperlinks.

Listing 3. The desired output
<html>
    <head><title>the title</title></head>
    <body>
        <ul>
            <li><a href="some-url">hyperlink text</a></li>
            <li><a href="some-url">hyperlink text</a></li>
        </ul>
    </body>
</html>

Writing the XSLT

With the input and output questions answered, you're ready to write the XSLT. If most of your experience has been with common programming languages, you might be tempted to think, "Okay, I'll build the heading, write a for loop to produce the list, and then build the footing." Instead, think of the pattern. The input <item> elements match the output <li> elements. Within each <item>, the <link> element matches the <a href> attribute, and the <title> element matches the text between the <a> tags. Now you are ready to create the XSLT. Perform these steps:

  1. The output is HTML, so include the <xsl:output> element to specify HTML.
  2. Add the root template—that is, <xsl:template match="/">—and fill it with the pattern of the HTML document, including both the header and the footer.
  3. Place the <xsl:apply-templates> element where the list belongs.
  4. Code a template to match the <item> elements to output the <li> element.

Listing 4 shows the complete XSLT.

Listing 4. The complete XSLT
<?xml version='1.0'?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

<xsl:output method="html"/>

<xsl:template match="/">
     <html>
          <head><title>Zen of XSLT</title></head>
          <body>
               <ul>
                    <xsl:apply-templates select="rss/channel/item"/>
               </ul>
          </body>
     </html>
</xsl:template>

<xsl:template match="item">
     <li><a href="{link}"><xsl:value-of select="title"/></a></li>
</xsl:template>

<xsl:template match="text()"/>

</xsl:stylesheet>

Remember the keys

The key to coding XSLT is to think in terms of pattern matching rather than calling functions. Two key questions must be answered:

  • What do I have?
  • What do I want?

Upon answering these questions, you can write the XSLT templates to match the input and output. Otherwise, you might feel as if you are using a socket wrench as a hammer hitting the handle of a screw driver to loosen a nut and bolt.

Resources

Learn

Get products and technologies

Discuss

Comments

developerWorks: Sign in

Required fields are indicated with an asterisk (*).


Need an IBM ID?
Forgot your IBM ID?


Forgot your password?
Change your password

By clicking Submit, you agree to the developerWorks terms of use.

 


The first time you sign into developerWorks, a profile is created for you. Information in your profile (your name, country/region, and company name) is displayed to the public and will accompany any content you post, unless you opt to hide your company name. You may update your IBM account at any time.

All information submitted is secure.

Choose your display name



The first time you sign in to developerWorks, a profile is created for you, so you need to choose a display name. Your display name accompanies the content you post on developerWorks.

Please choose a display name between 3-31 characters. Your display name must be unique in the developerWorks community and should not be your email address for privacy reasons.

Required fields are indicated with an asterisk (*).

(Must be between 3 – 31 characters.)

By clicking Submit, you agree to the developerWorks terms of use.

 


All information submitted is secure.

Dig deeper into XML on developerWorks


static.content.url=http://www.ibm.com/developerworks/js/artrating/
SITE_ID=1
Zone=XML, Web development
ArticleID=605478
ArticleTitle=Tip: The zen of XSLT
publish-date=01112011