はじめての XSLT SwapSKills 2009   vol.2 次に求められる  Web サイト制作の技術 株式会社まぼろし:小林 信次 2009.04.05 はじめての XSLT
自己紹介 <ul><li>小林信次(こばやし・しんじ) </li></ul><ul><li>株式会社まぼろし( maboroshi.biz ) </li></ul><ul><li>WEB ディレクター/マークアップエンジニア </li></ul>
自己紹介 2 刷 4 刷
自己紹介 2/27 発売
このセッションの流れ <ul><li>XSLT とは ? </li></ul><ul><li>XML を XSLT で変換してみよう ! </li></ul><ul><li>参考 </li></ul>
1.XSLT とは ? <ul><li>XML としての XSLT </li></ul><ul><li>XSLT の歴史 </li></ul><ul><li>XSLT の名前 </li></ul><ul><li>XSLT の役割 </li></ul>
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 の名前 <ul><li>XSLT=XSL Transformations </li></ul><ul><li>XSL =Extensible Stylesheet Language </li></ul><ul><li>    = 拡張...
XSLT の役割 <ul><li>XML を「他の形式の XML 」「 HTML 」「テキスト」 </li></ul><ul><li>などに変換することができる </li></ul>【例】 XML XSLT HTML XSL-FO PDF ブラ...
2.XML を XSLT で変換してみよう ! <ul><li>XSLT のお決まり </li></ul><ul><li>XML と XSLT を関連付ける </li></ul><ul><li>出力結果を指定する </li></ul><ul><...
XSLT のお決まり <ul><li><?xml version=&quot;1.0&quot; encoding=&quot;UTF-8&quot;?> </li></ul><ul><li><xsl:stylesheet   </li></u...
XML と XSLT を関連付ける <ul><li><?xml version=&quot;1.0&quot; encoding=&quot;UTF-8&quot;?> </li></ul><ul><li><?xml-stylesheet ty...
出力結果を指定する <ul><li><?xml version=&quot;1.0&quot; encoding=&quot;UTF-8&quot;?> </li></ul><ul><li><xsl:stylesheet   </li></ul...
XSLT はテンプレートのかたまり <ul><li>テンプレート = 一連のスタイル規則を定義したもの </li></ul><ul><li><?xml version=&quot;1.0&quot; encoding=&quot;UTF-8&q...
XSLT はテンプレートのかたまり <ul><li><xsl:template  match=&quot;/&quot; > </li></ul><ul><li>... </li></ul><ul><li></xsl:template> </l...
XSLT はテンプレートのかたまり XSLT ルート要素の テンプレート テンプレート テンプレート
2-1. DW と XSLT で、制作ページ一覧を作る <ul><li>変換する XML </li></ul><ul><li>要素・属性の内容を表示する </li></ul><ul><li>テンプレートから別のテンプレートを呼ぶ </li></...
変換する XML
変換する XML
要素・属性の内容を表示する <ul><li>要素の内容を表示: <xsl:value-of select=“hoge&quot; /> </li></ul><ul><li>属性の内容を表示:   <xsl:value-of select=“ho...
<ul><li>XML Path Language </li></ul><ul><li>マークアップ言語: XML に準拠した、 文書の特定の部分を指定する言語構文 = パスを示すルール </li></ul>XPath
XPath XPath で利用できる主な構文の例 構文 概要 例 / 直下の子要素 a/b a 要素直下の b 要素 // すべての 子孫要素 a//b a 要素内のすべての b 要素 * すべての要素 a/* a 要素直下のすべての要素 @ ...
テンプレートから別のテンプレートを呼ぶ <ul><li><xsl:apply-templates select=“hoge&quot; /> </li></ul>現在のノード からのパス ※ XPath 式で記述
テンプレートから別のテンプレートを呼ぶ <ul><li><xsl:stylesheet …> </li></ul><ul><ul><li><xsl:template match=&quot;/&quot;> </li></ul></ul><ul...
<ul><li>さらに何重にもテンプレートを呼び出すことが可能 </li></ul>テンプレートから別のテンプレートを呼ぶ ルート要素の テンプレート テンプレート テンプレート
テンプレートから別のテンプレートを呼ぶ <ul><li>テンプレートを </li></ul><ul><li>入れ子にするのは </li></ul><ul><li>NG </li></ul>ルート要素の テンプレート テンプレート テンプレート
<ul><li><xsl:for-each select=“hoge&quot;> </li></ul><ul><li>… </li></ul><ul><li></xsl:for-each> </li></ul>繰り返し処理 現在のノード配下に...
<ul><li><xsl:stylesheet …> </li></ul><ul><li><xsl:template match=&quot;/&quot;> </li></ul><ul><li><xsl:apply-templates sel...
<ul><li><a href=“<xsl:value-of select=“hoge/@fuga&quot; />”> </li></ul>属性を生成する 構文エラーに なってしまう
<ul><li><a> </li></ul><ul><li><xsl:attribute name=&quot;href&quot;> </li></ul><ul><li><xsl:value-of select=“hoge&quot; /> ...
2-2. AMAZON の WEB サービスを利用する <ul><li>変換する XML </li></ul><ul><li>連番を追加する </li></ul><ul><li>XSLT のソート機能 </li></ul><ul><li>条件に...
<ul><li>■ アマゾンへのリクエスト例 </li></ul><ul><li>http://ecs.amazonaws.jp/onca/ </li></ul><ul><li>xml?Service=AWSECommerceService <...
<ul><li><ItemSearchResponse> </li></ul><ul><li><Items> </li></ul><ul><li><Request> </li></ul><ul><li><ItemSearchRequest> <...
<ul><li><xsl:number format=&quot;01&quot; /> </li></ul>連番を追加する 番号の 表示形式 その他も もろもろ [ 割愛 ] format 属性指定 番号の表示形式 format=&quot;...
<ul><li><xsl:sort </li></ul><ul><li>select=“hoge“ </li></ul><ul><li>data-type=“hoge“ </li></ul><ul><li>order=“hoge&quot; /...
<ul><li><xsl:if test=“ 条件式”  > </li></ul><ul><li>内容 </li></ul><ul><li></xsl:if> </li></ul>条件によって表示を変える <xsl:choose> <xsl:w...
<ul><li>条件式の例 </li></ul><ul><li>price[number(.) &lt;= 3000] </li></ul>条件によって表示を変える [] -> フィルタパターン ※ 中に比較式や論理式 を記述可能
<ul><li>フィルタパターンの構文 </li></ul><ul><li>price[number(.) &lt;= 3000] </li></ul>条件によって表示を変える 要素 比較の対象 演算子 【比較式/論理式参考】 http://m...
<ul><li><xsl:value-of </li></ul><ul><li>select=“sum(hoge/fuga) div count(hoge/fuga)” /> </li></ul>平均値を求める hoge 要素内の fuga 要...
3. 参考 <ul><li>wikipedia http://ja.wikipedia.org/wiki/XSL_Transformations </li></ul><ul><li>MSDN ライブラリ http://msdn.microsof...
はじめての XSLT ありがとうございました [email_address]
Upcoming SlideShare
Loading in …5
×

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

2,232
-1

Published on

『はじめてのXSLT 』小林 信次
2009/4/5開催SwapSkills

* XSLTとは?
* XMLをXSLTで変換してみよう!
* まとめ

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,232
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
6
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

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

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

×