XML データは、単純な XSL スタイルシートを使用して HTML に変換できます。 XML 仕様が進化し続けるにつれて、新しいバージョンですべての人のニーズを満たす必要があるようですが、残念なことに、単純な変換を行うことが常に仕様を悩ませてきました。
ページのコンテンツを表す XML データがあり、そのコンテンツをレイアウトに変換したいとします。変換したい XML は次のとおりです:
<?xml version='1.0'?>
<?xml-stylesheet type="text/xsl" href="article.xsl"?>
<xml>
<フォルダー>
<フォルダ>
<text>フォルダ 1</text>
<ファイル>
<ファイル>
<text>ファイル 1</text>
<フィールド>
<フィールド>
<データ>
<type>文字列</type>
<長さ>50</長さ>
<value>いくつかのデータ</value>
</データ>
</フィールド>
</フィールド>
</ファイル>
</ファイル>
</フォルダ>
</フォルダ>
</xml>
このコンテンツは、フォルダー、ファイル、およびフィールドのセットを表します。各フォルダーにはファイルが含まれており、各ファイルにはデータを入力するためのフィールドが含まれています。フォルダー グループ内の各フォルダーは、TABLE の最初の行の TR 要素と TD 要素によって表されます。ファイル グループ内の各ファイルは、フォルダー TR 要素内にネストされた TABLE 要素の最初の行にある TR 要素および TD 要素として表されます。ドメイン グループ内の各ドメインは、関連ファイルの INPUT として表示されます。
このアイデアを実装するには、XML を走査し、XSL に基づいてテーブルを構築する必要があります。
この変換に使用される XSL は次のとおりです:
<?xml version="1.0"?>
<xsl:スタイルシート
xmlns:xsl=" http://www.w3.org/1999/XSL/Transform " version="1.0"
xmlns:msxsl="urn:schemas-microsoft-com:xslt"
xmlns:fn=" http://www.mycompany.com/mynamespace ">
<xsl:output method="html"/>
<msxsl:script language="JScript"implements-prefix="fn">
function getElementCount(nodelist, what) {
varrtrn = 0;
rtrn = ノードリスト[0].parentNode.selectNodes(what).length;
return (rtrn + 1); // フィラー TD に 1 が追加されます。
}
</msxsl:script>
<xsl:template match="/">
<TABLE CELLSPACING="0" CELLPADDING="0"
WIDTH="100%" BORDER="0" ID="tblRoot" NAME="tblRoot"
style="テーブルレイアウト:固定;">
<TR>
<xsl:for-each select="xml/folders/folder">
<xsl:要素名="TD">
<xsl:attribute name="style">width:55px</xsl:attribute>
<xsl:value-of select="text"/>
</xsl:要素>
</xsl:for-each>
<TD> </TD>
</TR>
<xsl:for-each select="xml/folders/folder">
<TR>
<xsl:要素名="TD">
<xsl:属性名="colspan">
<xsl:value-of select="fn:getElementCount(., 'folder')"/>
</xsl:属性>
<TABLE CELLSPACING="0" CELLPADDING="0"
WIDTH="100%" BORDER="0" style="table-layout:fixed;">
<TR>
<xsl:for-each select="ファイル/ファイル">
<xsl:要素名="TD">
<xsl:attribute name="style">width:55px;</xsl:attribute>
<xsl:value-of select="text"/>
</xsl:要素>
</xsl:for-each>
<TD> </TD>
</TR>
<xsl:for-each select="ファイル/ファイル">
<TR>
<xsl:要素名="TD">
<xsl:属性名="colspan">
<xsl:value-of select="fn:getElementCount(., 'file')"/>
</xsl:attribute>
<xsl:for-each select="fields/field">
<xsl:要素名="INPUT">
<xsl:attribute name="type">テキスト</xsl:attribute>
<xsl:属性名="最大長">
<xsl:value-of select="データ/長さ"/>
</xsl:属性>
<xsl:属性名="値">
<xsl:value-of select="データ/値"/>
</xsl:属性>
</xsl:element><BR/>
</xsl:for-each>
</xsl:element>
</TR>
</xsl:for-each>
</テーブル>
</xsl:要素>
</TR>
</xsl:for-each>
</TABLE>
</xsl:template>
</xsl:スタイルシート>
stylesheet タグでは、すべての xsl 変換タグを定義する xsl 名前空間を含む、いくつかの名前空間を設定します。 msxml 名前空間を使用すると、スタイルシートで使用できるユーザー関数を作成できます。 TD タグに設定された COLSPAN 属性を取得するために、これを使用してすべての子要素を取得します。 msxml:script 要素によって作成されたユーザー定義関数のセットを結合するために使用される fn 名前空間。
次に、外側の TABLE と最初の TR を作成します。 TR では、XML で指定されたフォルダーごとに TD を作成します。 xsl:element タグを使用したのは、カスタム属性を追加したり、別の TD 要素の COLSPAN 属性のプロパティを設定する関数を実行したりできるためです。
フォルダーごとに必要な TD を作成した後、フォルダーごとに TR の作成を開始しました。この TR には TD を 1 つだけ追加しますが、その COLSPAN 属性をフォルダー グループ内のフォルダー タグの数に 1 を加えたものに設定します。余分なものは、固定レイアウトの TABLE 内のスペースを埋めるために使用されます。
COLSPAN を取得するには、現在のコンテキスト (ここでは「.」で指定) と計算したいノードの名前を渡します。私の関数では、現在のコンテキスト、paraentNode、および XPath クエリで指定されたノードの数を取得します。次に、関数は、TD を満たすためにこの量に 1 を加えた値を返します。
この TD では、ファイル グループ内の各ファイルを含む別の TABLE を埋め込みます。この時点からのプロセスは、外部 TABLE 変換の場合と同じです。最後のステップは、各ファイルにフィールドを追加することです。今回は埋め込みテーブルを作成せず、フィールドを現在の TD に追加しただけです。
一般的なレイアウトが完了したら、ユーザーが関連するタブをクリックするまで他のフォルダーやファイル行を非表示にするなど、ユーザー インターフェイス機能の追加を開始できます。この機能を実現するには、この機能をサポートするスクリプトを作成し、onclick xsl:attribute 要素をフォルダーおよびファイルの TD 要素に追加し、その値をスクリプト関数の名前に設定します。
最後に、共通の機能が完了したら、クラス xsl:attributes を追加し、関連する classNames を STYLE または CSS に追加して、必要な外観を得ることができます。
この例では、Web データ ソリューションの展開に使用されるファイル - フォルダー - フィールド ビューの基礎を作成します。 Microsoft の XML 仕様の詳細については、MSDN にアクセスしてください。