XMLページをIEで表示させよう(基礎編): xsl:template

2003年8月3日(日)更新


■サンプルXMLテキストを表示する(3): 歌の読みだけを表示
(xsl:templateで変換ルールを指定)

たけち: 最初に表示したものは、ほんとうにとりあえずって感じですべてのテキストを表示させたけど、み〜んなつながっちゃって面白くなかったよね。今回は、XMLサンプルテキスト中の、すべての歌の「読み」だけを表示させてみよう。

さらら: 「読み」だけ表示、なんてことできるのね。

たけち: うん。この場合は、もとのXMLデータのyomiという要素の内容を表示するためのテンプレート(template)を作ればいいんだよ。これは、変換の流れ(3) でやったこととほとんど同じだよね。

さらら: あっ、そうなのね。

たけち: じゃっ、じゃあ。まずはXMLデータ例を再確認しておこうね。

XMLデータ例: 万葉集第1巻抜粋

<?xml version="1.0" encoding="Shift_JIS" ?>
<manyosyu>
<volume no="1">

<poem>
    <pno>8</pno>
    <mkana>熟田津尓 船乗世武登 月待者 潮毛可奈比沼 今者許藝乞菜</mkana>
    <poet>額田王(ぬかたのおおきみ)</poet>
    <yomi>熟田津(にきたつ)に、船(ふな)乗りせむと、月待てば、潮もかなひぬ、今は漕(こ)ぎ出(い)でな</yomi>
    <image>image/m0008.jpg</image>
    <mean>熟田津(にきたつ)で、船を出そうと月を待っていると、いよいよ潮の流れも良くなってきた。さあ、いまこそ船出するのです。</mean>
</poem>

<poem>
    <pno>20</pno>
    <mkana>茜草指 武良前野逝 標野行 野守者不見哉 君之袖布流</mkana>
    <poet>額田王(ぬかたのおおきみ)</poet>
    <yomi>茜(あかね)さす、紫野行き標野(しめの)行き、野守(のもり)は見ずや、君が袖振る</yomi>
    <image>image/m0020.jpg</image>
    <mean>(茜色の光に満ちている)紫野、天智天皇御領地の野で、あぁ、あなたはそんなに袖を振ってらして、野守が見るかもしれませんよ。
    </mean>
</poem>

<poem>
    <pno>23</pno>
    <mkana>打麻乎 麻續王 白水郎有哉 射等篭荷四間乃 珠藻苅麻須</mkana>
    <poet>作者不明</poet>
    <yomi>打ち麻(そ)を、麻続(をみの)の王(おほきみ)、海人(あま)なれや、伊良虞(いらご)の島の、玉藻(たまも)刈ります</yomi>
    <image>image/m0023.jpg</image>
    <mean>麻続(をみの)の王(おほきみ)さまは海人(あま)なのでしょうか、(いいえ、そうではいらっしゃらないのに、)伊良虞の島の藻をとっていらっしゃる・・・・・ </mean>
</poem>

<poem>
    <pno>24</pno>
    <mkana>空蝉之 命乎惜美 浪尓所濕 伊良虞能嶋之 玉藻苅食</mkana>
    <poet>作者不明</poet>
    <yomi>うつせみの、命を惜しみ、波に濡れ、伊良虞(いらご)の島の、玉藻(たまも)刈(か)り食(は)む</yomi>
    <image>image/m0024.jpg</image>
    <mean>命惜しさに、波に濡れながら、伊良虞(いらご)の島の藻をとって食べるのです・・・
麻続(をみの)の王(おほきみ)が伊良虞の島に流された時、島の人がこれを哀しんで詠んだ歌を聞いて詠んだ歌ということです。 </mean>
</poem>

<poem>
    <pno>28</pno>
    <mkana>春過而 夏来良之 白妙能 衣乾有 天之香来山</mkana>
    <poet>持統天皇(じとうてんのう)</poet>
    <yomi>春過ぎて 夏来たるらし 白妙(しろたえ)の 衣干したり 天(あめ)の香具山(かぐやま)</yomi>
    <image>image/m0028.jpg</image>
    <mean>春が過ぎて、夏が来たらしい。白妙(しろたえ)の衣が香久山(かぐやま)の方に見える。 </mean>
    </poem>
<poem>
    <pno>37</pno>
    <mkana>雖見飽奴 吉野乃河之 常滑乃 絶事無久 復還見牟</mkana>
    <poet>柿本人麻呂(かきのもとのひとまろ)</poet>
    <yomi>見れど飽かぬ、吉野の川の、常滑(とこなめ)の、絶ゆることなく、またかへり見む</yomi>
    <image>image/m0037.jpg</image>
    <mean>何度見ても飽きることの無い吉野の川の常滑(とこなめ)のように、絶えること無く何度も何度も見にきましょう。</mean>
</poem>

</volume>
</manyosyu>

さらら: 歌番号pno万葉仮名mkana、作者poet、などのたくさんの要素から、歌poem要素ができているのね。

たけち: そうだね。このXMLデータの中のすべての歌の「読み(yomi)」だけを表示"ということは何をするのかってことを図に示しておくね。変換後のHTMLでは、p要素の内容として歌の読みをそれぞれひとつの段落として表示するようにするね。

それぞれの歌の「読み(yomi)」を表示

さらら: あ、雰囲気はわかるわ。poem(歌)yomi(読み)の内容をHTMLのp要素の内容として変換するためのテンプレートのあるXSLTスタイルシートを作るのね。そうでしょ。

たけち: そう、そうなんだ。よかった。分かってもらえて・・・・じゃあ、このようにするためのXSLTスタイルシートの例を次に載せるね。

さらら: は〜い。

XSLTスタイルシート例:

<?xml version="1.0" encoding="Shift_JIS"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
    <html>
    <head>
    <title>XSLサンプル : xsl:template</title>
    </head>
    <body>
    <p align="center">万葉集第1巻抜粋: 歌の読みを表示(1)</p>
    <xsl:apply-templates />
    </body>
    </html>
</xsl:template>

<xsl:template match="poem">
    <p><xsl:value-of select="yomi" /></p>
</xsl:template>

</xsl:stylesheet>

さらら: テンプレートが二つあって、最初にある <xsl:template match="/"> は、ルートノード用のテンプレートだったわね。このテンプレートから始まるって思っていいのよね。

たけち: そうだね。で、もうひとつの

<xsl:template match="poem">
    <p><xsl:value-of select="yomi" /></p>
</xsl:template>

が、ノードpoemに適用するテンプレートだよね。

さらら: あっ、そうなのね。それで、

ここで重要なのはたらきをしているのは、
  • <xsl:apply-templates />
  • <xsl:template match="poem">
の二つだよ。

さらら: 変換の流れ(3) で教えてもらったように、

    <xsl:apply-templates />

が、ルートノードの下のノードについてのテンプレートを適用するっていう指定なのね。

たけち: そうだね。この指定をXSLTプロセッサ(ここではmsxml)が見て、処理してくれるんだったね。

さらら: このXSLTスタイルシートだと、テンプレートルール

<xsl:template match="poem">
    <p><xsl:value-of select="yomi" /></p>
</xsl:template>

が、すべてのノードpoemに適用されるのね。

たけち: そうだったね。ここでは、<xsl:template match="poem">というところで次のような指定をしているんだ。

<xsl:template match="poem">
元のXMLデータの中に"poem"という名前のノードが見つかったら、以下の文(ここでは<xsl:value-of select="yomi" /></p>だけですね)で指定されているルールを実行してください。
<xsl:value-of select="yomi" /></p>
元のXMLテキストの中の"volume/poem"の下の"yomi"のテキストをとってきてください。

全ての歌の読み(yomi)を表示するXSLTスタイルシートのはたらき

さらら: なるほど、そうなんだぁ〜。そうやって、"yomi"のテキストがhtmlの中に<p>熟田津(にきたつ)に、・・・・・<p>って入るのね。

たけち: それで、msxmlが「元のXMLテキスト内のすべての"volume/poem"の下の"yomi"」について処理してくれているんだよ。

さらら: あっ、そうだったわね。 前回の説明とあわせてこれでおおまかな流れについては分かったような気がするわ... (^ ^; ともかく、今回のXSLTスタイルシート指定だと、「歌の読み(yomi)」だけが表示されるのよね。

たけち: そうなんだ。それがわかってもらえたら十分だよ。じゃあ、このXSLTスタイルシートを"basic_2.xsl"というファイルにして、実際にどうなるか見てみようね。次のテキストをクリックしてみて。あっ、そうそう。XMLデータの2行目は
<?xml-stylesheet type="text/xsl" href="basic_2.xsl"?>
として、"basic_2.xml"というファイルを作成しているからね。

万葉集第1巻抜粋のXMLファイル basic_2.xml(上記説明のXSL適用)

こんな風に表示されます・・・

さらら: あっ、出た出た!! だいたい想像していたとおりだわ!! なんだかうれしい。

たけち: よかった〜。

さらら: ねぇねぇ、たけちぃ〜。すこし面白くなってきたから、もっとかっこいい表示をしましょうよ〜。原文とか、イメージも入れたりして!!

たけち: そうだね。じゃあ、tableで、原文とか、イメージとかも表示してみようか。

さらら: わ〜い!! (*^ ^*)

→次回は、すべての要素を表示-1(xsl:value-of)です。  (^ ^)v


(注) apply-templatesとxsl:template

xsl:template要素中にxsl:apply-templates要素を記述して、さらに子ノードについてxsl:templateで処理することを指定します。xsl:apply-templates要素のselect属性を指定しないと、現在処理している要素のすべての子要素について該当するxsl:templateを探して処理します。

次のようにselect属性を書いてどの子ノードについてテンプレートを適用するのかを明示もかまいません。このことについては、また詳しくお話させていただく予定です。

<xsl:apply-templates />
  ↓
<xsl:apply-templates select="/manyosyu/volume" />

apply-templatesとtemplate