XML文書をHTMLに変換するその1 – スタイルシートで変換

XML文書をXSLTスタイルシートを使ってHTML変換します。個人用PCにインストールした Apache HTTPサーバにXMLファイルとXSLファイルを保管して、WebブラウザからWebページとして出力されるか確認します。（Xalan XSLTプロセッサは使用しません）

XML文書の準備
XSLファイル作成
動作確認

XML文書の準備

XMLファイルを作成して、Webサーバのドキュメントフォルダ下に保存します。今回は C:\Apach24\htdocs の下にsample2024_1というフォルダを作成しました。

motorcycle.xml

<?xml version="1.0" encoding="UTF-8" ?>
<?xml-stylesheet type="text/xsl" href="motorcycle.xsl" ?>
<motorcycle>
  <model>
    <maker>HONDA</maker>
    <model_name>CBR250RR</model_name>
    <displacement>249</displacement>
    <power>42</power>
    <gearbox>6段リターン</gearbox>
  </model>
     ・
   (中略)
     ・  
  <model>
    <maker>KAWASAKI</maker>
    <model_name>Z250</model_name>
    <displacement>248</displacement>
    <power>35</power>
    <gearbox>6段リターン</gearbox>
  </model>
</motorcycle>

XSLファイル作成

XML文書からオートバイの一覧を出力するXSLファイルを作成してXMLと同じフォルダに保存します。

mortorcycle.xsl

<?xml version="1.0"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" encoding="utf-8"/>
<xsl:template match="/">
  <html>
    <head>
      <title>MotorCycle</title>
    </head>
    <body>
    <table border="1">
      <tr>
        <th>メーカー</th>
        <th>モデル名</th>
        <th>排気量(cc)</th>
        <th>最大出力(ps)</th>
        <th>変速機形式</th>
      </tr>
      <xsl:for-each select="/motorcycle/model">
        <tr>
          <td><xsl:value-of select="maker"/></td>
          <td><xsl:value-of select="model_name"/></td>
          <td><xsl:value-of select="displacement"/></td>
          <td><xsl:value-of select="power"/></td>
          <td><xsl:value-of select="gearbox"/></td>
        </tr>
      </xsl:for-each>
    </table>
    </body>
  </html>
</xsl:template>
</xsl:stylesheet>

3行：<xsl:output>のmethodを”html”にします。
5-17行：HTMLタグを記入します。
16-24行：<xsl:for-each>で明細行を繰り返し出力しています。

動作確認

WebブラウザからXMLファイルにアクセスします。オートバイの一覧がWebページとして表示されましす。HTMLのTABLEを出力しています。cssで装飾をするともう少し見映えがよくなりますね。

サンプルページはこちら

仕組みは簡単ですが検索機能もない静的ページということで使い道があまりないんですよね…
次回はJavascriptの非同期処理を使って検索条件をXSLに渡す処理について解説します。