XSLT - Auf dem Client
Wenn Ihr Browser XSLT unterstützt, kann es im Browser verwendet werden, um Dokumente in XHTML umzuwandeln.
JavaScript-Lösung
In den vorherigen Kapiteln haben wir erklärt, wie man XSLT verwendet, um ein XML-Dokument in XHTML umzuwandeln. Wir haben dies erreicht, indem wir der XML-Datei ein XSL-Stylesheet hinzugefügt und die Konvertierung über den Browser durchgeführt haben.
Obwohl diese Methode gut funktioniert, ist das Hinzufügen einer Stylesheet-Referenz zur XML-Datei nicht immer zufriedenstellend (zum Beispiel funktioniert diese Methode nicht in Browsern, die XSLT nicht erkennen).
Ein vielseitigerer Ansatz ist die Verwendung von JavaScript, um die Konvertierung durchzuführen.
Durch die Verwendung von JavaScript können wir:
- Browser-Erkennungstests durchführen
- Verwenden Sie verschiedene Stylesheets basierend auf Browser und Benutzerbedürfnissen
Das ist die Schönheit von XSLT! Eines der Entwurfsziele von XSLT war es, die Transformation von Daten von einem Format in ein anderes zu ermöglichen und dabei verschiedene Arten von Browsern und unterschiedliche Benutzerbedürfnisse zu unterstützen.
Clientseitige XSLT-Transformation wird in Zukunft mit Sicherheit zu einer der Hauptaufgaben werden, die von Browsern ausgeführt werden, und wir werden auch ihr Wachstum in spezifischen Browsermärkten sehen (Braille, akustische Browser, Webdrucker, Handheld-Geräte und so weiter).
XML-Dateien und XSL-Dateien
Betrachten Sie das XML-Dokument, das bereits in einem vorherigen Kapitel gezeigt wurde:
Beispiele
<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>
Und das zugehörige XSL-Stylesheet:
Beispiele
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html>
<body>
<h2>Meine CD-Sammlung</h2>
<table border="1">
<tr bgcolor="#9acd32">
<th style="text-align:left">Titel</th>
<th style="text-align:left">Künstler</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>
Beachten Sie, dass diese XML-Datei keinen Verweis auf die XSL-Datei enthält.
Wichtig:Die obige Aussage bedeutet, dass die XML-Datei mit mehreren verschiedenen XSL-Stylesheets transformiert werden kann.
Hinweis: Stellen Sie sicher, dass die XSL-Datei über den Link im Browser korrekt geöffnet werden kann, wie unten gezeigt:
Andernfalls können Fehler auftretenUncaught TypeError: Failed to execute 'importStylesheet' on 'XSLTProcessor': parameter 1 is not of type 'Node'.。
XML im Browser in XHTML konvertieren
Dies ist der Quellcode, mit dem die XML-Datei auf dem Client in XHTML konvertiert wird:
Beispiele
Selbst ausprobieren »
Tipp:Wenn Sie nicht wissen, wie man JavaScript schreibt, lesen Sie bitte unserJavaScript-Tutorial。
Beispielerklärung:
Die loadXMLDoc()-Funktion
Die loadXMLDoc()-Funktion wird verwendet, um die XML- und XSL-Dateien zu laden.
Sie prüft den Browsertyp des Benutzers und lädt die Datei.
Die displayResult()-Funktion
Diese Funktion wird verwendet, um die durch die XSL-Datei formatierte XML-Datei anzuzeigen.
- XML- und XSL-Dateien laden
- Browsertyp des Benutzers testen
- Wenn der Browser des Benutzers ActiveX-Objekte unterstützt:
- Verwenden Sie die Methode transformNode(), um das XSL-Stylesheet auf das XML-Dokument anzuwenden
- Legen Sie den body des aktuellen Dokuments (id="example") so fest, dass er das XML-Dokument mit angewendetem Stylesheet enthält
- Wenn der Browser des Benutzers keine ActiveX-Objekte unterstützt:
- Erstellen Sie ein neues XSLTProcessor-Objekt und importieren Sie die XSL-Datei
- Verwenden Sie die Methode transformToFragment(), um das XSL-Stylesheet auf das XML-Dokument anzuwenden
- Legen Sie den body des aktuellen Dokuments (id="example") so fest, dass er das XML-Dokument mit angewendetem Stylesheet enthält
Andere Erweiterungen