図1 ITproが提供しているRSSフィード [画像のクリックで拡大表示] |
図2 XMLの例 --- ITproが提供しているRSSデータの内容 [画像のクリックで拡大表示] |
■インターネットで利用されるデータ形式
流行のAjax(Asynchronous JavaScript and XML)の「x」は,XMLの「x」である(AjaxではXMLを利用していないものもある)。AjaxでのXMLの役割は,Webブラウザ側でのJavaScriptの実行に必要なデータを,サーバー側から取得する際の一つのデータ形式ということである。XMLはテキストでデータを記述することができるので,インターネットでの通信や公開のためのデータ形式として都合がよい。
■ プログラムが扱いやすい文法
今のWebページは,XHTMLという書式で作成されたものが多くなっている。XHTMLは,HTMLをXML形式に変更したもの。XHTMLもHTMLも,テキストでコンテンツを記述するので,ソースを一見しただけでは違いを感じることができないかもしれない。<と>で囲んだタグを用いてコンテンツやデータを記していくという点ではどちらも同じである。違いはタグの記述方法などの文法にある。
XHTMLの文法は,HTMLよりも厳密に定められている。例えばHTMLでの段落区切りを意味するP要素は,その終了タグを省略することができる。一方のXHTMLでは,終了タグを省略することはできない。それはXMLのルールがそうなっているためで,XMLをベースにするXHTMLもそれに従っているのである。
何らかのプログラムからXHTMLまたはHTMLドキュメントを操作したい場合,ドキュメントの構成が厳密であるほど,プログラムを作りやすいことは想像できるだろう。XMLではドキュメント作成時の文法が厳密に定められているので,プログラムからドキュメントを操作する際に都合がよいわけだ。実際,XMLドキュメントを操作するためのAPIが,さまざまなプログラミング言語で実装されている。
■ 自分で名前を付けて定義できる
XMLの特徴として押さえておきたいものが,もう一つある。それはドキュメントで使用する要素の名前を自分で決めることができることだ。自由に付けた名前の要素を識別するための仕組みとして名前空間という概念が取り入れられている。名前空間については,話が長くなってしまうので,次回以降に改めて解説する。RSSデータや,そのほかのXMLデータでは,まだ見たことがないような名前のタグが使われている。これらは,XMLとしての枠組みの中で,新しく命名された要素の名前なのだ。
XMLの利用例は,インターネット上で直接目に触れることが少ない。サーバー側でのデータ管理フォーマットして使われていたり,SOAP通信のデータとしてやりとりされたりしている。また,インターネット以外での利用例も多く,アプリケーションでの設定ファイルとしてXMLが使用されていたり,Officeドキュメントのフォーマットに採用されていたりする。
図3 アップルコンピュータが提供していRSSデータ [画像のクリックで拡大表示] |
■ XMLドキュメントを操作してみる
せっかくなので,一般に公開されているXMLドキュメントを,簡単なJavaScriptで操作してみよう。その際,XML用のスタイルシート(XSLTスタイルシート)を使う。次回以降でXSLTスタイルシートの作成についても解説していく。今回使用するXMLドキュメントは,アップルコンピュータのiPod + iTunesページで公開している「トップテンソング RSS」(対象ページ)とする。このRSSデータ(図3)は,iTunes Music Storeでの人気ソングのリストを,日替わりで毎日更新しているものだ。
したがって,このRSSデータから必要な項目をHTML表示させることができれば,日替わりの人気ソングをいつでも閲覧することができる。今回作成したサンプル・ファイルは,アップルコンピュータによるトップテンソングのデータを,一覧表示と詳細表示で切り替えて表示するようにした(図4,図5)。
図4 サンプル・ファイルによる一覧表示 [画像のクリックで拡大表示] |
図5 サンプル・ファイルによる詳細表示 [画像のクリックで拡大表示] |
サンプル・ファイルはInternet Explorerのみで実行できる。WebブラウザのJavaScriptでXMLファイルにアクセスする場合,一般にセキュリティ保護のため,ほかのドメインのXMLファイルを読み込むことができない。ただ,ローカルPC上のHTMLファイルをInternet Explorerで実行する場合は任意のドメインのXMLファイルにアクセスできる。
図6 Internet Explorerでの情報バーの表示 [画像のクリックで拡大表示] |
リスト1 サンプルのindex.htmファイルのソース [画像のクリックで拡大表示] |
また最初の表示には,インターネット経由でXMLファイルを読み込むため,少々時間がかかるかもしれない。しかし一度読み込んだXMLファイルはそのままオンメモリーで保持しているので,一覧表示と詳細表示の切り替えに時間がかかることはない。
サンプル・ファイルには,HTMLファイルのほかに2つのXSLTスタイルシート・ファイルが含まれている。XSLTスタイルシートの解説は次回以降とし,ここではHTMLファイルに記述した簡単なJavaScript(リスト1)を解説しておく。
(1)の部分では,実際に読み込む3つのファイル名を3つの変数に代入している。それらのファイルは,対象のXMLファイルと,一覧表示と詳細表示のための2つのXSLTスタイルシートである。
(2)の部分で,3つのファイルを実際に読み込んでいる。ここで使用しているオブジェクトはInternet Explorer専用である。Ajaxの特徴は非同期通信だが,この場合のJavaScriptは3つのファイルをすべてロードしたあとで表示したいため,同期通信をしている。
(3)では,XMLファイルにXSLTスタイルシートを適用し,ドキュメントのdivタグ(<div id="placehere"></div>)の中に,変換結果であるHTMLを流し込んでいる。func1()の実行により,style1.xslファイルを使用した一覧表示となり,func2()の実行により,style2.xslファイルを使用した詳細表示となる。
次回より,サンプル・ファイルで使用しているXMLやXSLTスタイルシートについて,基本事項を解説していく。
木村 達哉 インフォテリア 教育部 インフォテリア認定教育センターの運営や,XML技術者認定制度のXMLマスターに対応したコーステキストの開発などに携わる。XMLは,何となく知っているようでもそれを正しく扱うためにはなかなか奥が深いもの。そんなXMLへの入口を紹介します。 |