【Adobe Spry TIPS】XMLとXPath

このエントリーをはてなブックマークに追加

【Adobe Spry TIPS】RSSを取得して表示する。の補足

XMLとXPathについては一番なじみが深いと思われるXHTMLを元に解説していきます。

XHTMLはもともとSGMLベースで策定されたHTMLを、XMLベースに策定しなおしたものであり、XMLとはXHTMLのように複数の要素を入れ子にして情報を表現する為のマークアップ言語です。

XPathはXMLの特定の要素までの道筋を記述する方法です。

サンプルに、当blogの最新の状態を保存したXHTMLを用意しました。
(xml宣言の追加や、サーバーの設定のため拡張子をxmlに変更した物)

このサンプルを元に最新のエントリー一覧を抽出するXPathを書いてみます。

まず、一番外側の要素(html要素)を記述します。

/html

次にその内側の要素。エントリー一覧はbody要素内にあるのでbody要素を記述します。

/html/body

このように要素の頭には/(スラッシュ)を記述します。

次の要素。サンプルの場合は<div id="container">になります。

/html/body/div

次の要素。サンプルの場合は<div id="main">になります。

ただ、この場合<div id="container">内には<div id="main">以外に<div id="header">、<div id="navi">、<div id="footer">が存在する為、明確に区別するために以下のように記述します。

/html/body/div/div[@id='main']

これはid属性がmainのdiv要素を示すXPathになります。

最後に<div id="main">内のh2要素の一覧を取得します。

/html/body/div/div[@id='main']/h2

これが、<div id="main">内のh2要素を指し示すXPathになります。

Spryでは、この繰り返し要素をXMLDataSetを利用して取得します。

var RssData = new Spry.Data.XMLDataSet("XMLファイル", "/html/body/div/div[@id='main']/h2");

次にh2要素内の項目を抽出して表示します。

<ul spry:region="RssData" spry:repeat="RssData">
	<li><a href="{a/@href}">{a}</a></li>
</ul>

{a}でa要素内のテキストを、{a/@href}でa要素のhref属性の値を表示します。

これでXHTMLより抽出したタイトル一覧が表示されます。

サンプル

XPasthはもっと複雑な形態も表示することが可能ですが、Spryを使う上では目的の一覧を取得できるだけで問題ありません。

たとえば【Adobe Spry TIPS】RSSを取得して表示する。で利用しているxPathはatomフィールドのエントリーの一覧を取得するためのXPathになります。

RSS1.0のフィードのエントリーの一覧を取得するには以下のようなXPathを記述します。

RssData = new Spry.Data.XMLDataSet(“RSSフィード", "/rdf/item");
<li><a href="{link}"<{title}</a></li>

RSS2.0のフィードのエントリーの一覧を取得するには以下のようなXPathを記述します。

RssData = new Spry.Data.XMLDataSet(“RSSフィード", "/rss/item");
<li><a href="{link}"<{title}</a></li>

【Adobe Spry TIPS】 目次

スポンサードリンク

«パスワードを表示するブックマークレット | メイン | [書評]SMO(ソーシャルメディア最適化)実践テクニック»

このエントリーのトラックバックURL
http://blog.webcreativepark.net/cgi/mt/mt-bt.cgi/1165
コメントを投稿