Home > Articles > Web Services > XML

Seven Steps to XML Mastery, Step 3: Transform with XSLT (Part 1 of 2)

  • Print
  • + Share This
Frank Coyle is ready to take us one step closer to XML mastery in this article on how to leverage the power of XSLT, XPath, and namespaces to generate HTML code dynamically from the customer's XML data.
For more information about this series, start by reading Frank Coyle's introduction, Seven Steps to XML Mastery: About This Series.
From the author of

In the previous articles along our path to XML mastery, we looked at some XML basics and explored how to separate content from display. At ZwiftBooks, where you’ve been hired to prepare the way for dynamic web content generation, your strategy revolved around using a limited subset of HTML for basic display and applying CSS to spice up that display. Now it’s time to move up to step 3 and look at how to use XSLT, XPath, and namespaces to generate the HTML directly from XML data.

XSLT Overview

XSLT is a powerful XML-based technology for both formatting and transforming XML. In this article, we’ll look at XSLT as a transformation language, exploring how it can be used to take us from XML to HTML. In practice, XSLT can be used to generate a variety of output, including HTML, other dialects of XML, or even a program or Excel spreadsheet. As long as the input is XML input, XSLT can convert it into whatever kind of text-based output you need.

XSLT works by way of the application of templates (rules) that tell an XSLT processor what element and/or attribute data to extract from an XML input document, and then how to map that data to some kind of text output. XSLT template rules leverage an associated XML Recommendation called XPath, which describes the syntax for navigating an XML document tree.

Our overall objective is to illustrate how XSLT can be used to generate a web page that displays some of the more popular ZwiftBooks offerings. The output we want is a list of titles, authors, and ISBNs based on data in an XML document. In keeping with our strategy of separating content from display, our output will be a plain vanilla, unordered HTML list of book selections. This arrangement will allow our web team to work its CSS magic. Although the default HTML display for an unordered list is a bulleted list, as we’ll see, our ZwiftBooks design team has created a style sheet that will give a unique "ZwiftBooks feel" to the web display.

Figure 1 illustrates our starting point, the XML booklist. It also shows our end product as it appears in a browser. The transformation process requires both XSLT and an XSLT processing engine. In our example, the input is a list of books with author, title, and ISBN. Input is fed to an XSLT processing engine, which uses an XSLT document specifying the transformation rules for generating the output.

Figure 1

Figure 1 XSLT uses rules or templates to transform an XML input document into HTML. CSS may be used to style the output in a variety of ways.

Figure 1 also illustrates how the relatively simple HTML that is the end product of the transformation process can be paired with a CSS style sheet that reflects the sensibilities of the design team.

  • + Share This
  • 🔖 Save To Your Account