Home > Developer > JavaScript
The first is the XML file:
Test.xml
1 <?XML version= "1.0" encoding= "Utf-8"?>2 <Team>3 <peopleID= "1">4 <name>Lisi</name>5 <Gender>F</Gender>6 </people>7 <peopleID= "2">8 <name>Zhangsan</name>9 <Gender>M</Gender>Ten </people> One </Team>
Then the XSL style sheet file:
Test.xsl
1 <?XML version= "1.0"?>2 <Xsl:stylesheetversion= "1.0"xmlns:xsl= "Http://www.w3.org/1999/XSL/Transform">3 4 <xsl:templateMatch="/">5 <HTML>6 <Body>7 <H2>My Team People</H2>8 <xsl:apply-templates/>9 </Body>Ten </HTML> One </xsl:template> A - <xsl:templateMatch= "People"> - <P> the <xsl:apply-templatesSelect= "Name"/> - <xsl:apply-templatesSelect= "Gender"/> - </P> - </xsl:template> + - <xsl:templateMatch= "Name"> +Title:<spanstyle= "COLOR: #ff0000"><xsl:value-ofSelect="."/></span> A <BR/> at </xsl:template> - - <xsl:templateMatch= "Gender"> -Gender:<spanstyle= "COLOR: #00ff00"><xsl:value-ofSelect="."/></span> - <BR/> - </xsl:template> in - </Xsl:stylesheet>
Finally, create an HTML file that looks like this:
Test.html
1 <HTML>2 <Body>3 <Scripttype= "Text/javascript">4 5 //load XML6 var xml = new ActiveXObject ("Microsoft.XMLDOM");7 Xml.async = false;8 xml.load ("Test.xml");9 Ten //load XSL One var xsl = new ActiveXObject ("Microsoft.XMLDOM"); A Xsl.async = false; - xsl.load ("test.xsl"); - the //transform - document.write (Xml.transformnode (XSL)); - - </Script> + </Body> - </HTML>
Open the test.html file under IE browser, you can see the XML file is not plain text, but add the test.xsl style.
Note: This is converting XML to HTML on the browser side, but not all browsers support XSLT, so a more reliable way is to convert the XML to HTML on the server side and then send the HTML to the browser.
Convert XML to HTML via JavaScript
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
