"Getting Started with XSLT" presentation slides
- 1. Getting Started With XSLT Russell Ward STC-PMC 2017 Conduit Conference – Willow Grove, PA
- 2. Presentation purpose What we want to accomplish today Define the basic components required to make XSLT happen Learn the basic processing flow when XSLT occurs Explore basic stylesheet components Create a very basic stylesheet to transform an XML file to an HTML file What we will not accomplish today Learn all about XSLT and become experts
- 3. Speaker contact information Russ Ward Senior Technical Writer at Spirent Communications in Frederick, MD. Owner of West Street Consulting, a part-time enterprise specializing in Structured FrameMaker plugins and custom development. 5280 Corporate Drive, Suite A100 Frederick, MD 21703 301.444.2489 [email protected] www.spirent.com 357 W. North St. Carlisle, PA 17013 717.240.2989 [email protected] www.weststreetconsulting.com
- 4. What is XSLT? Stands for eXstensible Stylesheet Language Transformation It is a mature standard for converting XML to some other text format, such as HTML, CSV, other XML, or anything text. Well-supported in the IT community through forums, tools, tutorials, etc.
- 5. Components required to make XSLT happen An XML file with the data to transform An XSLT stylesheet with the instructions for the transformation An engine that applies the stylesheet to the XML file; that is, does all the work Some mechanism to capture the output XML file Engine Style- sheet Output
- 6. Key concepts about the XSLT processing flow By default (using an empty stylesheet), the output of a transform is all the text node data of the original XML file. Effectively, the process starts at the root element and automatically walks through every branch of the tree. When you want something specific to happen, your stylesheet must effectively put up a “red light” to stop this flow at some node. Once you stop the flow, you can start to customize the output however you want. The key element to stop the automatic flow is <xsl:template>. All instructions for a customized output live in one of these elements. To resume the flow (if desired), the<xsl:apply-templates> element is effectively a green light.
- 7. About processing engines Many different processing engines are available. Some are free and some are not. All are designed for operation within some particular context. For example: • XML editors – Any worthy XML editor will include XSLT processing. In this context, it is often used for stylesheet design and testing. The output is typically rendered in some window within the editor interface. To learn more, Wikipedia has a decent article on XML editor comparisons. • Programming and scripting languages – All mainstream languages have some nature of built-in libraries for XSLT. When invoking XSLT with a language, it typically means that you have your stylesheet ready and you are looking to automate the process, for whatever reason. • Web browsers – All major browsers can do XSLT. For a browser, the output is normally the browser window. Therefore, the typical use case for XSLT in a browser is to dynamically transform some kind of XML content into a browser-ready format (HTML).
- 8. DEMO FILES
- 9. Sample web page that does XSLT <html> <body> <script language="javascript"> var xmlDoc = new ActiveXObject("Microsoft.XMLDOM"); xmlDoc.async="false"; xmlDoc.load("good_songs.xml"); var stylesheetDoc = new ActiveXObject("Microsoft.XMLDOM"); stylesheetDoc.async="false"; stylesheetDoc.load("stylesheet.xsl"); document.write(xmlDoc.transformNode(stylesheetDoc)); </script> </body> </html> This webpage loads a source file named “good_songs.xml” and a stylesheet named “stylesheet.xml” and writes the output to the page (browser screen). **NOTE** FOR SIMPLICITY, THIS ONLY WORKS WITH IE. All browsers can do XSLT, but the JavaScript syntax varies. If you want to use another browser, Google can find a sample for you. Also, the XML file and stylesheet must be in the same directory as the webpage file.
- 10. Simple XML file <?xml version="1.0" encoding="UTF-8"?> <songs> <song> <name>Behind Blue Eyes</name> <composer>Peter Townshend</composer> <performer>Limp Bizkit</performer> <year>2003</year> </song> <song> <name>Highways, Heartaches and Time Well Wasted</name> <composer>Lisa LeBlanc</composer> <performer>Lisa LeBlanc</performer> <year>2014</year> </song> <song> <name>Part 1</name> <composer>Ben Bridwell</composer> <performer>Band of Horses</performer> <year>2006</year> </song> </songs> This is the input file designed to work with all the sample stylesheets that follow.
- 11. Stylesheet example 1 <?xml version="1.0" encoding="UTF-8"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> </xsl:stylesheet> Basic empty stylesheet – Output includes all text nodes in the source file.
- 12. Stylesheet example 1 – Sample output <?xml version="1.0" encoding="UTF-8"?> Behind Blue Eyes Peter Townshend Limp Bizkit 2003 Highways, Heartaches and Time Well Wasted Lisa LeBlanc Lisa LeBlanc 2014 Part One Ben Bridwell Band of Horses 2006
- 13. Stylesheet example 2 <?xml version="1.0" encoding="UTF-8"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="/"> </xsl:template> </xsl:stylesheet> This stylesheet contains a template that stops the processing at the root node (the very beginning). It contains no further instructions, so the output is empty.
- 14. Stylesheet example 2 – Sample output <?xml version="1.0" encoding="UTF-8"?>
- 15. Stylesheet example 3 <?xml version="1.0" encoding="UTF-8"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="/"> HI THERE! </xsl:template> </xsl:stylesheet> This stylesheet contains a template that stops the processing at the root node (the very beginning). The template has some static text (HI THERE!), but otherwise no further instructions. So, this text goes to the output and that is it.
- 16. Stylesheet example 3 – Sample output <?xml version="1.0" encoding="UTF-8"?> HI THERE!
- 17. Stylesheet example 4 <?xml version="1.0" encoding="UTF-8"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="/"> HI THERE! <xsl:apply-templates /> </xsl:template> </xsl:stylesheet> This stylesheet contains a template that stops the processing at the root node (the very beginning). It contains static text and the <xsl:apply-templates> element. This time, the static text is output, then the <xsl:apply-templates> element provides the green light to continue walking through the tree.
- 18. Stylesheet example 4 – Sample output <?xml version="1.0" encoding="UTF-8"?> HI THERE! Behind Blue Eyes Peter Townshend Limp Bizkit 2003 Highways, Heartaches and Time Well Wasted Lisa LeBlanc Lisa LeBlanc 2014 Part One Ben Bridwell Band of Horses 2006
- 19. Stylesheet example 5 <?xml version="1.0" encoding="UTF-8"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="/"> <html> <body> <p><b>My favorite songs</b></p> <ul> <xsl:apply-templates /> </ul> </body> </html> </xsl:template> <xsl:template match="name"> <li><xsl:apply-templates /></li> </xsl:template> <xsl:template match="composer" /> <xsl:template match="performer" /> <xsl:template match="year" /> </xsl:stylesheet> This stylesheet is one simple example of how to make an HTML page with a bullet list of song names. It uses a template to match the song name element, then other empty templates to block output from the other song elements. This is likely not the way it should be done… but it helps illustrate the flow of XSLT processing.
- 20. Stylesheet example 5 – Sample output <?xml version="1.0" encoding="UTF-8"?> <html> <body> <p> <b>My favorite songs</b> </p> <ul> <li>Behind Blue Eyes</li> <li>Highways, Heartaches and Time Well Wasted</li> <li>Part One</li> </ul> </body> </html>
- 21. Stylesheet example 6 <?xml version="1.0" encoding="UTF-8"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="/"> <html> <body> <p><b>My favorite songs</b></p> <ul> <xsl:for-each select="descendant::song"> <li><xsl:value-of select="name" /></li> </xsl:for-each> </ul> </body> </html> </xsl:template> </xsl:stylesheet> This stylesheet is a second example of how to make a bullet list of the song names. It uses a fancier methodology, where the <xsl:for-each> element specifically searches out all the <song> elements. It does not rely on template matching during the automatic flow through the document. In fact, there is almost no automatic flow anyway, because the first template stops the flow at the root and there is no <xsl:apply-templates> element to restart it. Effectively, everything stops at the root, with specific instructions on where to go from there. It also uses an <xsl:value-of> element to retrieve the element text, rather than an <xsl:apply-template> element like other examples. This element retrieves only the text content of the context element. If the context element contains text only, it does the same thing as <xsl:apply-templates />. Lots of different ways to do the same things.
- 22. Stylesheet example 6 – Sample output <?xml version="1.0" encoding="UTF-8"?> <html> <body> <p> <b>My favorite songs</b> </p> <ul> <li>Behind Blue Eyes</li> <li>Highways, Heartaches and Time Well Wasted</li> <li>Part One</li> </ul> </body> </html>
- 23. Stylesheet example 7 <?xml version="1.0" encoding="UTF-8"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="/"> <html> <body> <p><b>My favorite songs</b></p> <table border="1"> <tr> <th>Song</th> <th>Composer</th> <th>Performer</th> <th>Year</th> </tr> <xsl:apply-templates /> </table> </body> </html> </xsl:template> <xsl:template match="song"> <tr> <td><b><xsl:value-of select="name" /></b></td> <td><xsl:value-of select="composer" /></td> <td><xsl:value-of select="performer" /></td> <td><xsl:value-of select="year" /></td> </tr> </xsl:template> </xsl:stylesheet> This stylesheet creates an HTML page with a table of all the song data. Unlike previous examples, it uses all the data in the source file, not just the song names. The syntax and methodology builds on previous examples.
- 24. Stylesheet example 7 – Sample output <?xml version="1.0" encoding="UTF-8"?> <html> <body> <p> <b>My favorite songs</b> </p> <table border="1"><tr><th>Song</th><th>Composer</th><th>Performer</th><th>Year</th></tr> <tr><td><b>Behind Blue Eyes</b></td><td>Peter Townshend</td><td>Limp Bizkit</td><td>2003</td></tr> <tr><td><b>Highways, Heartaches and Time Well Wasted</b></td><td>Lisa LeBlanc</td><td>Lisa LeBlanc</td><td>2014</td></tr> <tr><td><b>Part One</b></td><td>Ben Bridwell</td><td>Band of Horses</td><td>2006</td></tr> </table> </body> </html>