If your browser supports XSLT, then it can be used to convert documents in the browser as XHTML.
JavaScript Solutions
In the previous chapter, we've sent you explain how to use XSLT to transform an XML document into XHTML. We are accomplished by way of this work: add XSL stylesheet to the XML file, and complete the conversion by the browser.
Even if this approach works well, including the style sheet references are not always satisfactory (for example, the browser does not recognize this approach would not work XSLT) in an XML file.
More general approach is to use JavaScript to complete the conversion.
By using JavaScript, we can:
- Browser validation tests conducted
- Depending on the browser and the user needs to use a different stylesheet
This is the XSLT charm! One of XSLT is designed to make converting one format to another format possible, to support different types of browsers and different user needs.
Browser-side XSLT transformation will become one of the next major task performed by the browser, and we will see its growth (Braille, network printers, audio equipment, etc.) in a particular browser market.
XML files and XSL files
Look at this in the previous chapter has shown off an XML document:
<?xml version="1.0" encoding="ISO-8859-1"?> <catalog> <cd> <title>Empire Burlesque</title> <artist>Bob Dylan</artist> <country>USA</country> <company>Columbia</company> <price>10.90</price> <year>1985</year> </cd> . . . </catalog>
And accompanying XSL style sheet:
<?xml version="1.0" encoding="ISO-8859-1"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="/"> <html> <body> <h2>My CD Collection</h2> <table border="1"> <tr bgcolor="#9acd32"> <th align="left">Title</th> <th align="left">Artist</th> </tr> <xsl:for-each select="catalog/cd"> <tr> <td><xsl:value-of select="title" /></td> <td><xsl:value-of select="artist" /></td> </tr> </xsl:for-each> </table> </body> </html> </xsl:template> </xsl:stylesheet>
Please note, the XML file does not contain a reference to the XSL file.
IMPORTANT: The above sentence means, XML files can use several different XSL stylesheet to convert.
In the browser convert XML to XHTML
This is used to convert the XML file to XHTML source code for the client:
<html> <body> <script type="text/javascript"> // Load XML var xml = new ActiveXObject("Microsoft.XMLDOM") xml.async = false xml.load("cdcatalog.xml") // Load XSL var xsl = new ActiveXObject("Microsoft.XMLDOM") xsl.async = false xsl.load("cdcatalog.xsl") // Transform document.write(xml.transformNode(xsl)) </script> </body> </html>
Tip: If you do not know how to write JavaScript, please learn our " JavaScript Tutorial ."
First piece of code creates an instance of Microsoft's XML parser, then the XML file into memory. The second paragraph of code creates another instance of the parser, and then the XSL file into memory. The last line of code using XML document XSL document conversion, and the browser displays the result as XHTML. mission completed!