XSLT - Klien

Jika browser Anda mendukung XSLT, maka di browser ini dapat digunakan untuk mengkonversi dokumen ke XHTML.

Lösung JavaScript

Di bab sebelumnya, kami telah menjelaskan bagaimana menggunakan XSLT untuk mengkonversi dokumen XML ke XHTML. Kita menyelesaikan pekerjaan ini melalui jalur berikut: menambahkan gaya tabel XSL ke berkas XML, dan melaksanakan transformasi melalui browser.

Meskipun metode ini berkesan, mengandung referensi gaya di dalam berkas XML tidak selalu memuaskan (contoh, metode ini tidak akan berfungsi di browser yang tidak mengenal XSLT).

Metode yang lebih umum adalah menggunakan JavaScript untuk melaksanakan transformasi.

Dengan menggunakan JavaScript, kami dapat:

  • Melakukan tes konfirmasi browser
  • Gunakan berbagai gaya tabel berdasarkan kebutuhan browser dan pengguna

Ini adalah keindahan XSLT! Salah satu tujuan desain XSLT adalah untuk memungkinkan konversi format dari satu format ke yang lain, serta mendukung berbagai tipe browser dan kebutuhan pengguna.

Transformasi XSLT di sisi pengguna browser pasti akan menjadi salah satu tugas utama yang akan dijalankan oleh browser masa mendatang, serta kita akan melihat pertumbuhannya di pasar browser khusus (bacaan braille, printer jaringan, peralatan audisi, dll).

Berkas XML dan Berkas XSL

Lihat dokumen XML ini yang telah ditunjukkan di bab sebelumnya:

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

Lihat berkas XML ini

dan gaya XSL yang disertai:

<?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>Koleksi CD Saya</h2> 
    <table border="1">
      <tr bgcolor="#9acd32">
        <th align="left">Judul</th> 
        <th align="left">Artis</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>

Lihat berkas XSL ini

Perhatian, berkas XML ini tidak mengandung referensi ke berkas XSL.

Perhatian penting:Kalimat di atas berarti bahwa berkas XML dapat diubah menggunakan berbagai macam tabel gaya XSL untuk konversi.

Konversi XML ke XHTML di browser

Ini adalah kode sumber untuk mengkonversi berkas XML ke XHTML di klien:

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

Panduan:Jika Anda belum mengerti bagaimana menulis JavaScript, belajar dari panduan kami diPanduan JavaScript》。

Kode pertama menciptakan sebuah instansia parser XML Microsoft, lalu memuat berkas XML ke memori. Kode kedua menciptakan instansia parser lainnya, lalu memuat berkas XSL ke memori. Baris terakhir menggunakan dokumen XSL untuk mengkonversi dokumen XML, dan menampilkan hasilnya sebagai XHTML di browser. Tugas selesai!

Lihat bagaimana cara kerjanya di IE