XSLT - Klient

Om din webbläsare stöder XSLT, kan den användas för att konvertera dokument till XHTML.

JavaScript-lösning

I föregående kapitel har vi visat dig hur du använder XSLT för att konvertera en XML-dokument till XHTML. Vi genomförde detta genom att lägga till en XSL-stilschema till XML-filen och genomföra omvandlingen via webbläsaren.

Även om detta sätt fungerar bra, är det inte alltid tillfredsställande att inkludera stilscheman i XML-filer (t.ex. fungerar detta inte i webbläsare som inte kan känna igen XSLT).

En mer generell metod är att använda JavaScript för att genomföra omvandlingen.

Genom att använda JavaScript kan vi:

  • Genomför webbläsartest
  • Använd olika stilar beroende på webbläsare och användarens behov

Det är just XSLT:s charmer! En av designmålen med XSLT är att göra det möjligt att konvertera från ett format till ett annat, samtidigt som det stödjer olika typer av webbläsare och olika användarbehov.

XSLT-omvandling på klientens sida kommer säkert att bli en av de huvudsakliga uppgifterna som webbläsare kommer att utföra i framtiden, och vi kommer också att se dess tillväxt inom specifika webbläsarmarknader (blindtext, nätverksskrivare, hörselutrustning, etc.).

XML-filer och XSL-filer

Se titta på denna XML-dokument som redan har visats i föregående kapitel:

<?xml version="1.0" encoding="ISO-8859-1"?>
<catalog>
  <cd>
    <title>Empire Burlesque</title>
    <artist>Bob Dylan</artist>
    <land>USA</land>
    <bolag>Columbia</bolag>
    <pris>10.90</pris>
    <år>1985</år>
  </cd>
.
.
.
</catalog>

Se denna XML-fil。

och tillhörande XSL-stilbokslut:

<?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>Min CD-samling</h2> 
    <table border="1">
      <tr bgcolor="#9acd32">
        <th align="left">Titel</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>

Se denna XSL-fil。

Observera att denna XML-fil inte innehåller referenser till XSL-filer.

Viktigt:Detta innebär att XML-filen kan konverteras till XHTML med flera olika XSL-stilbokslut.

Konvertera XML till XHTML i webbläsaren

Detta är källkoden för att konvertera XML-filer till XHTML på kundsidan:

<html>
<body>
<script type="text/javascript">
// Ladda XML 
var xml = new ActiveXObject("Microsoft.XMLDOM")
xml.async = false
xml.load("cdcatalog.xml")
// Ladda XSL
var xsl = new ActiveXObject("Microsoft.XMLDOM")
xsl.async = false
xsl.load("cdcatalog.xsl")
// Transform
document.write(xml.transformNode(xsl))
</script>
</body>
</html>

Tips:Om du inte känner till hur man skriver JavaScript, lär dig vårJavaScript教程》。

Det första kodsegmentet skapar ett exempel på Microsofts XML-parser, läser sedan in XML-filen i minnet. Det andra kodsegmentet skapar en annan instans av paret och läser sedan in XSL-filen i minnet. Sista raden använder XSL-dokumentet för att konvertera XML-dokumentet och visar resultatet som XHTML i webbläsaren. Uppgiften är klar!

Se hur det fungerar i IE。