XSLT - Klient

Jeśli Twoja przeglądarka obsługuje XSLT, może być używana do konwersji dokumentu na XHTML.

Rozwiązanie JavaScript

W poprzednich rozdziałach wyjaśniliśmy, jak używać XSLT do konwersji dokumentu XML na XHTML. Zrobiliśmy to poprzez dodanie XSL style sheet do pliku XML i przeprowadzenie konwersji przez przeglądarkę.

Chociaż ten sposób działa dobrze, zawieranie odniesień do style sheets w plikach XML nie zawsze jest zadowalające (np. w przeglądarkach, które nie rozpoznają XSLT, ta metoda nie działa).

Jednym z bardziej uniwersalnych sposobów jest użycie JavaScript do wykonania konwersji.

Używając JavaScript, możemy:

  • Przeprowadzenie testów potwierdzających przeglądarki
  • Używanie różnych style sheets w zależności od przeglądarki i potrzeb użytkownika

Oto urok XSLT! Jednym z celów projektowania XSLT jest możliwość przekształcania jednego formatu na inny, jednocześnie wspierając różne typy przeglądarek oraz różne potrzeby użytkowników.

Konwersja XSLT na końcu klienta będzie jednym z głównych zadań wykonywanych przez przyszłe przeglądarki, a także zobaczymy jego rozwój na rynku przeglądarek (dla niewidomych, drukarek sieciowych, urządzeń słuchowych, itp.).

XML i XSL pliki

Zobacz ten XML dokument, który został przedstawiony w poprzednich rozdziałach:

<?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>

Zobacz ten XML plik.

oraz towarzyszące XSL style sheets:

<?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>Moja kolekcja płyt CD</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>

Zobacz ten plik XSL.

Proszę zauważyć, że ten plik XML nie zawiera odniesień do pliku XSL.

Ważne:To oznacza, że plik XML można przekształcić za pomocą wielu różnych arkuszy stylów XSL.

Konwersja XML na XHTML w przeglądarce

Oto kod źródłowy używany do konwersji pliku XML na XHTML na klientach:

<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>

Wskazówka:Jeśli nie wiesz, jak pisać JavaScript, naucz się naszegoTutorial JavaScript》。

Pierwszy kod tworzy instancję analizatora XML Microsoft, a następnie ładuje plik XML do pamięci. Drugi kod tworzy inną instancję analizatora i ładuje plik XSL do pamięci. Ostatni wiersz kodu przekształca dokument XML za pomocą dokumentu XSL i wyświetla wynik jako XHTML w przeglądarce. Zadanie zakończone!

Zobacz, jak działa w IE.