XMLデータを読み込み表示する（Adobe Spry）

説明

Adobe SpryフレームワークでXMLデータ処理を行うには、xpath.jsとSpryData.jsファイルを読み込ませます。ページ上にXMLデータを表示する領域と、何のデータを表示するかを指定します。表示する領域の指定はspry:region属性を使い表示対象となるデータベース名を指定します。このデータベース名はスクリプトファイルで設定したものになります。
XMLデータ表示領域を設定したら、繰り返し表示する領域を指定します。繰り返し表示する場合にはspry:repeat属性を使いデータベース名を指定します。実際にXMLデータを表示する部分は{〜}で囲み、{データベース名:タグ名}のように指定します。
HTML文書での表示設定だけではXMLデータは表示されません。スクリプトで使用するデータベース名、XMLデータファイル名、データの基準位置を指定するXPathを指定します。これはSpry.Data.XMLDataSet()を使って指定します。最初のパラメータがXMLデータファイル名、2番目がXPathとなります。
JavaScriptテクニック ブック 　詳しい解説などはJavaScriptテクニック ブックを参照してください。

サンプルコード [実行]

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>JavaScript Sample</title>
<link rel="stylesheet" type="text/css" href="main.css" media="all">
<script src="xpath.js" type="text/javascript"></script>
<script src="SpryData.js" type="text/javascript"></script>
<script type="text/javascript" src="main.js"></script>
</head>
<body>
<h1>XML形式のデータを読み込み表示する（Adobe Spry）</h1>
<div spry:region="myDatabase">
<table border="1" cellspacing="0">
<tr><th>名前</th><th>価格</th></tr>
<tr spry:repeat="myDatabase">
<td>{myDatabase::name}</td><td>{myDatabase::price}円</td>
</tr>
</table>
</div>
</body>
</html>
myDatabase = new Spry.Data.XMLDataSet("data.xml", "/list/fruits");