XSLT-客戶端 - JavaShuo

XSLT 是一種用於將 XML 文檔轉換爲 XHTML 文檔或其餘 XML 文檔的語言。XPath 是一種用於在 XML 文檔中進行導航的語言。

JavaScript 解決方案

在前面的章節，咱們已向您講解如何使用 XSLT 將某個 XML 文檔轉換爲 XHTML。咱們是經過如下途徑完成這個工做的：向 XML 文件添加 XSL 樣式表，並經過瀏覽器完成轉換。
即便這種方法的效果很好，在 XML 文件中包含樣式表引用也不老是使人滿意的（例如，在沒法識別 XSLT 的瀏覽器這種方法就沒法奏效）。
更通用的方法是使用 JavaScript 來完成轉換。
經過使用 JavaScript，咱們能夠：
• 進行瀏覽器確認測試
• 根據瀏覽器和用戶需求來使用不一樣的樣式表
這就是 XSLT 的魅力所在！XSLT 的設計目的之一就是使數據從一種格式轉換到另外一種格式成爲可能，同時支持不一樣類型的瀏覽器以及不一樣的用戶需求。
客戶端的 XSLT 轉換必定會成爲將來瀏覽器所執行的主要任務之一，同時咱們也會看到其在特定的瀏覽器市場的增加（盲文、聽覺瀏覽器、網絡打印機，手持設備，等等）。html

XML 文件和 XSL 文件

請看這個在前面的章節已展現過的 XML 文檔：linux

<?xml version="1.0" encoding="UTF-8"?>
<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>

以及附隨的 XSL 樣式表：瀏覽器

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html> 
<body>
  <h2>My CD Collection</h2>
  <table border="1">
    <tr bgcolor="#9acd32">
      <th style="text-align:left">Title</th>
      <th style="text-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>

請注意，這個 XML 文件沒有包含對 XSL 文件的引用。
重要事項：上面這句話意味着，XML 文件可以使用多個不一樣的 XSL 樣式表來進行轉換。網絡

在瀏覽器中把 XML 轉換爲 XHTML

這是用於在客戶端把 XML 文件轉換爲 XHTML 的源代碼：
實例app

<!DOCTYPE html>
<html>
<head>
<script>
function loadXMLDoc(filename)
{
if (window.ActiveXObject)
  {
  xhttp = new ActiveXObject("Msxml2.XMLHTTP");
  }
else 
  {
  xhttp = new XMLHttpRequest();
  }
xhttp.open("GET", filename, false);
try {xhttp.responseType = "msxml-document"} catch(err) {} // Helping IE11
xhttp.send("");
return xhttp.responseXML;
}
 
function displayResult()
{
xml = loadXMLDoc("cdcatalog.xml");
xsl = loadXMLDoc("cdcatalog.xsl");
// code for IE
if (window.ActiveXObject || xhttp.responseType == "msxml-document")
  {
  ex = xml.transformNode(xsl);
  document.getElementById("example").innerHTML = ex;
  }
// code for Chrome, Firefox, Opera, etc.
else if (document.implementation && document.implementation.createDocument)
  {
  xsltProcessor = new XSLTProcessor();
  xsltProcessor.importStylesheet(xsl);
  resultDocument = xsltProcessor.transformToFragment(xml, document);
  document.getElementById("example").appendChild(resultDocument);
  }
}
</script>
</head>
<body onload="displayResult()">
<div id="example" />
</body>
</html>

本文地址：https://www.linuxprobe.com/on-the-client.html測試