はじめての XSLT SwapSKills 2009   vol.2 次に求められる  Web サイト制作の技術 株式会社まぼろし:小林 信次 2009.04.05 はじめての XSLT
自己紹介 小林信次(こばやし・しんじ) 株式会社まぼろし( maboroshi.biz ) WEB ディレクター/マークアップエンジニア
自己紹介 2 刷 4 刷
自己紹介 2/27 発売
このセッションの流れ XSLT とは ? XML を XSLT で変換してみよう ! 参考
1.XSLT とは ? XML としての XSLT XSLT の歴史 XSLT の名前 XSLT の役割
XML としての XSLT XSL XML etc XHTML XSL-FO XSLT XPath SVG MathML
XSLT の歴史 1999-11-16 XSLT Version 1.0 2007-01-21 XSLT Version 2.0
XSLT の名前 XSLT=XSL Transformations XSL =Extensible Stylesheet Language     = 拡張可能なスタイルシート言語 Transformation= 変換、変形 XSLT= 拡張可能なスタイルシートによる データ構造変換
XSLT の役割 XML を「他の形式の XML 」「 HTML 」「テキスト」 などに変換することができる 【例】 XML XSLT HTML XSL-FO PDF ブラウジング 印刷
2.XML を XSLT で変換してみよう ! XSLT のお決まり XML と XSLT を関連付ける 出力結果を指定する XSLT はテンプレートのかたまり DW と XSLT で、制作ページ一覧を作る Amazon の WEB サービスを利用する
XSLT のお決まり <?xml version=&quot;1.0&quot; encoding=&quot;UTF-8&quot;?> <xsl:stylesheet   xmlns:xsl=&quot;http://www.w3.org/1999/XSL/Transform&quot;> ... </xsl:stylesheet>
XML と XSLT を関連付ける <?xml version=&quot;1.0&quot; encoding=&quot;UTF-8&quot;?> <?xml-stylesheet type=&quot;text/xsl&quot; href=“hoge.xsl&quot; ?> ... </xsl:stylesheet> XSLT までのパス application/xslt+xml application/xml
出力結果を指定する <?xml version=&quot;1.0&quot; encoding=&quot;UTF-8&quot;?> <xsl:stylesheet   xmlns:xsl=&quot;http://www.w3.org/1999/XSL/Transform&quot;> <xsl:output method=&quot;html&quot; encoding=&quot;UTF-8&quot; /> ... </xsl:stylesheet> 【 xsl:output /属性参考】 http://msdn.microsoft.com/ja-jp/library/ms256187.aspx xml html text QNAME
XSLT はテンプレートのかたまり テンプレート = 一連のスタイル規則を定義したもの <?xml version=&quot;1.0&quot; encoding=&quot;UTF-8&quot;?> <xsl:stylesheet   xmlns:xsl=&quot;http://www.w3.org/1999/XSL/Transform&quot;> <xsl:output method=&quot;html&quot; encoding=&quot;UTF-8&quot;> <xsl:template match=&quot;/&quot;> ... </xsl:template> </xsl:stylesheet> ルート要素に適用 されるテンプレート ※ このテンプレートから他のテンプレートを 呼び出したりが可能
XSLT はテンプレートのかたまり <xsl:template  match=&quot;/&quot; > ... </xsl:template> match 属性 テンプレートが XML 文書のどの要素に 適用されるのか 上記の例「 match=“/” 」 = XML 文書のルート要素に適用される = XML 文書全体に適用
XSLT はテンプレートのかたまり XSLT ルート要素の テンプレート テンプレート テンプレート
2-1. DW と XSLT で、制作ページ一覧を作る 変換する XML 要素・属性の内容を表示する テンプレートから別のテンプレートを呼ぶ 繰り返し処理 属性を生成する
変換する XML
変換する XML
要素・属性の内容を表示する 要素の内容を表示: <xsl:value-of select=“hoge&quot; /> 属性の内容を表示:   <xsl:value-of select=“hoge/@hoge&quot; /> 現在のノード からのパス ※ XPath 式で記述 hoge 要素 の hoge 属性 hoge 要素 の内容
XML Path Language マークアップ言語: XML に準拠した、 文書の特定の部分を指定する言語構文 = パスを示すルール XPath
XPath XPath で利用できる主な構文の例 構文 概要 例 / 直下の子要素 a/b a 要素直下の b 要素 // すべての 子孫要素 a//b a 要素内のすべての b 要素 * すべての要素 a/* a 要素直下のすべての要素 @ 要素の属性 a/@b a 要素の b 属性
テンプレートから別のテンプレートを呼ぶ <xsl:apply-templates select=“hoge&quot; /> 現在のノード からのパス ※ XPath 式で記述
テンプレートから別のテンプレートを呼ぶ <xsl:stylesheet …> <xsl:template match=&quot;/&quot;> <xsl:apply-templates select=“hoge&quot; /> </xsl:template> <xsl:template match=“hoge&quot;> </xsl:template> </xsl:stylesheet> select 属性と一致した match 属性の値を持つ テンプレートが呼び出される
さらに何重にもテンプレートを呼び出すことが可能 テンプレートから別のテンプレートを呼ぶ ルート要素の テンプレート テンプレート テンプレート
テンプレートから別のテンプレートを呼ぶ テンプレートを 入れ子にするのは NG ルート要素の テンプレート テンプレート テンプレート
<xsl:for-each select=“hoge&quot;> … </xsl:for-each> 繰り返し処理 現在のノード配下にある すべての hoge 要素を 繰り返し処理
<xsl:stylesheet …> <xsl:template match=&quot;/&quot;> <xsl:apply-templates select=“hoge&quot; /> </xsl:template> <xsl:template match=“hoge&quot;> <xsl:for-each select=“fuga&quot;> … </xsl:for-each> </xsl:template> </xsl:stylesheet> 現在のノード ルート要素 ルート要素 内の hoge 要素 hoge 要素 内の fuga 要素
<a href=“<xsl:value-of select=“hoge/@fuga&quot; />”> 属性を生成する 構文エラーに なってしまう
<a> <xsl:attribute name=&quot;href&quot;> <xsl:value-of select=“hoge&quot; /> </xsl:attribute> <xsl:value-of select=“fuga&quot; /> </a> 属性を生成する href 属性を 生成し、 href 属性の値に、 hoge 要素の 内容を指定 a 要素の内容に、 fuga 要素の 内容を指定
2-2. AMAZON の WEB サービスを利用する 変換する XML 連番を追加する XSLT のソート機能 条件によって表示を変える 平均値を求める 85
■ アマゾンへのリクエスト例 http://ecs.amazonaws.jp/onca/ xml?Service=AWSECommerceService &AWSAccessKeyId=1JCQ41ZTFKEWXT0FZ602 &AssociateTag=skoba-22 &Operation=ItemSearch &SearchIndex=Books &Keywords=xhtml &Sort=salesrank &ResponseGroup=ItemAttributes,Images 変換する XML
<ItemSearchResponse> <Items> <Request> <ItemSearchRequest> <Keywords> <Item> <DetailPageURL>   <MediumImage> <URL> <Height> <Width>   <ItemAttributes>   <Author>   <Creator Role=“hoge&quot;>   <ListPrice>   <Amount>   <NumberOfPages>   <Publisher>   <Title> 変換する XML
<xsl:number format=&quot;01&quot; /> 連番を追加する 番号の 表示形式 その他も もろもろ [ 割愛 ] format 属性指定 番号の表示形式 format=&quot;1&quot; 1 2 3 ..... 10 11 12 ..... format=&quot;A&quot; A B C ..... Z AA AB AC ..... format=&quot;a&quot; a b c ..... z aa ab ac ..... format=&quot;i&quot; i ii iii iv v vi ..... format=&quot;I&quot; I II III IV V VI ..... format=&quot; あ &quot; あ い う え お か  ..... format=&quot; ア &quot; ア イ ウ エ オ カ  ..... format=&quot; 一 &quot; 一 二 三 四 五 六  ..... format=&quot; 壱 &quot; 壱 弐 参 四 五 六  .....
<xsl:sort select=“hoge“ data-type=“hoge“ order=“hoge&quot; /> XSLT のソート機能 ソートする対象 の要素を指定 データ型 text/number の 2 種類 昇順 [ascending] 降順 [descending]
<xsl:if test=“ 条件式”  > 内容 </xsl:if> 条件によって表示を変える <xsl:choose> <xsl:when test=“ 条件式 A”> 内容 A </xsl:when> <xsl:otherwise> 内容 B </xsl:otherwise> </xsl:choose> 条件式が true のときに内容を表示 条件式 A が true の ときに内容 A を表示 それ以外のときに 内容 B を表示 xsl:when は複数指定可能
条件式の例 price[number(.) &lt;= 3000] 条件によって表示を変える [] -> フィルタパターン ※ 中に比較式や論理式 を記述可能
フィルタパターンの構文 price[number(.) &lt;= 3000] 条件によって表示を変える 要素 比較の対象 演算子 【比較式/論理式参考】 http://msdn.microsoft.com/ja-jp/library/ ms256081(VS.80).aspx
<xsl:value-of select=“sum(hoge/fuga) div count(hoge/fuga)” /> 平均値を求める hoge 要素内の fuga 要素の合計 【さまざまな XPath 関数参考】 http://msdn.microsoft.com/ja-jp/library/ ms256138(VS.80).aspx 割り算 hoge 要素内の fuga 要素の数
3. 参考 wikipedia http://ja.wikipedia.org/wiki/XSL_Transformations MSDN ライブラリ http://msdn.microsoft.com/ja-jp/library/default.aspx XML 関係アーカイブ  | Takazudo Clipping* http://gyauza.egoism.jp/clip/archives/xml/
はじめての XSLT ありがとうございました [email_address]

『はじめてのXSLT 』小林 信次