Latest web development tutorials

クライアント上のXSLT

お使いのブラウザは、XSLT、XHTMLに文書を変換するために使用することができ、ブラウザをサポートしている場合。


JavaScriptのソリューション

前の章では、我々はあなたがどのようにXHTMLにXML文書を変換するためにXSLTを使用することを教えてきました。 XMLファイルに追加されたXSLスタイルシートを、ブラウザを介して変換を完了します。私たちは、次の方法を介してこれを行います。

この方法の効果は非常に良好であっても、スタイルシートの参照は、必ずしも満足のいくものではない(例えば、XSLTブラウザで、このアプローチは動作しません認識されません)、XMLファイルに含まれています。

より一般的なアプローチは、変換を完了するためにJavaScriptを使用することです。

JavaScriptを使用することにより、私たちは次のことができます。

  • 確認テスト用のブラウザ
  • ブラウザユーザに応じて異なるスタイルシートを使用する必要があります

これは、XSLTの魅力です! XSLTは、可能なある形式から別の形式にデータを作成し、ブラウザや別のユーザーのニーズの異なる種類をサポートするように設計された1つです。

クライアントのXSLT変換は、ブラウザによって実行される主なタスクの将来の1になるだろう、と私たちは特定のブラウザ市場での成長(点字、聴覚ブラウザ、ネットワークプリンタ、ハンドヘルドデバイスなど)が表示されます。


XML文書とXSLファイル

前のセクションでは、XML文書をオフに示してきた中でこれを見て:

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

XMLファイルを表示します

そして、XSLスタイルシートを伴います:

<?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>My CD Collection</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>

XSLファイルを参照してください

XMLファイルは、XSLファイルへの参照が含まれていませんので、あらかじめご了承ください。

重要:上記の文は意味、XMLファイルは変換するために、いくつかの異なるXSLスタイルシートを使用することができます。


ブラウザでは、XHTMLにXMLを変換します

これは、XHTMLソースコードへのXMLファイルへのクライアントのためのものです:

<html>
<head>
<script>
function loadXMLDoc(dname)
{
if (window.ActiveXObject)
{
xhttp=new ActiveXObject("Msxml2.XMLHTTP.3.0");
}
else
{
xhttp=new XMLHttpRequest();
}
xhttp.open("GET",dname,false);
xhttp.send("");
return xhttp.responseXML;
}

function displayResult()
{
xml=loadXMLDoc("cdcatalog.xml");
xsl=loadXMLDoc("cdcatalog.xsl");
// code for IE
if (window.ActiveXObject)
{
ex=xml.transformNode(xsl);
document.getElementById("example").innerHTML=ex;
}
// code for Mozilla, 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>

»をお試しください

ヒント:あなたはJavaScriptを書く方法がわからない場合は、私たちの勉強してくださいJavaScriptのチュートリアルを

例としては、説明します。

loadXMLDoc()関数

loadXMLDoc()関数は、XMLとXSLファイルをロードするために使用されます。

これは、ブラウザの種類をチェックして、ユーザーがファイルをロードする必要があります。

displayResult()関数

この関数は、XSLファイルを使用して表示スタイルXMLファイルを定義するために使用されます。

  • XMLとXSLファイルのロード
  • テストユーザーは、ブラウザの種類を持っています
  • ユーザーのブラウザのサポートActiveXオブジェクトの場合:
    • XML文書にXSLスタイルシートのTRANSFORMNODE()メソッドを使用します。
    • 現在の文書(ID = "例")ボディスタイルは、XML文書を適用されている含むセット
  • ユーザーのブラウザは、ActiveXオブジェクトをサポートしていない場合:
    • 新しいオブジェクトとインポートXSLファイルを作成しますXSLTProcessor
    • XML文書にXSLスタイルシートのtransformToFragment()メソッドを使用します。
    • 現在の文書(ID = "例")ボディスタイルは、XML文書を適用されている含むセット