Spry Framework入门（一）——XML数据集及显示

简介：
        Spry Framework是Adobe出品的轻量级的支持Ajax的JavaScript库，以HTML为中心，使用最基本的HTML、CSS和JavaScript来实现丰富Web页面体验。


试验环境：

操作系统：windows2003 Server
浏览器：IE7.0 RC1      FireFox 1.5.0.7
WEB服务器：IIS 6.0
Spry库：Spry_P1_3_08-11


安装：
从 http://labs.adobe.com/technologies/spry/ 下载安装包，目前版本为Spry_P1_3_08-11.zip，解开后把includes目录复制到自己的IIS虚拟目录上即可。


页面代码：
data.xml

<? xml version="1.0" encoding="UTF-8" ?>
< specials >
     < menu_item  id ="1" >
         < item > 夏日沙拉 </ item >
         < description > organic butter lettuce with apples, blood oranges, gorgonzola, and raspberry vinaigrette. </ description >
         < price > 7 </ price >
         < url > summersalad.xml?id=1 </ url >
     </ menu_item >
     < menu_item  id ="2" >
         < item > Thai Noodle Salad </ item >
         < description > lightly sauteed in sesame oil with baby bok choi, portobello mushrooms, and scallions. </ description >
         < price > 8 </ price >
         < url > thainoodles.xml </ url >
     </ menu_item >
     < menu_item  id ="3" >
         < item > Grilled Pacific Salmon </ item >
         < description > served with new potatoes, diced beets, Italian parlsey, and lemon zest. </ description >
         < price > 16 </ price >
         < url > salmon.xml </ url >
     </ menu_item >
</ specials >

test.html

 1 < head >
 2      < meta  http-equiv ="Content-Type"  content ="text/html; charset=UTF-8"   />
 3      < title > Spry Example </ title >
 4     
 5      <!-- Link the Spry libraries -->
 6      < script  type ="text/javascript"  src ="includes/xpath.js" ></ script >
 7      < script  type ="text/javascript"  src ="includes/SpryData.js" ></ script >
 8     
 9      <!-- Create a data set object -->
10      < script  type ="text/javascript" >
11        var dsSpecials = new Spry.Data.XMLDataSet("data.xml", "specials/menu_item");
12     </ script >
13 </ head >
14
15 < body >
16
17      <!-- Create the Spry dynamic region -->
18      < div  id ="Specials_DIV"  spry:region ="dsSpecials" >
19      <!-- Display the data in a table -->
20          < table  id ="Specials_Table" >
21          < tr >
22              < th > 名称 </ th >
23              < th > Description </ th >
24              < th > 价格 </ th >
25          </ tr >
26          < tr  spry:repeat ="dsSpecials" >
27              < td > {item} </ td >
28              < td > {description} </ td >
29              < td > {price} </ td >
30          </ tr >
31          </ table >
32      </ div >
33
34 </ body >