Spry学习(一)----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

< head >
     < meta  http-equiv ="Content-Type"  content ="text/html; charset=UTF-8"   />
     < title > Spry Example </ title >
    
     <!-- Link the Spry libraries -->
     < script  type ="text/javascript"  src ="includes/xpath.js" ></ script >
     < script  type ="text/javascript"  src ="includes/SpryData.js" ></ script >
    
     <!-- Create a data set object -->
     < script  type ="text/javascript" > ...
        var dsSpecials = new Spry.Data.XMLDataSet("data.xml", "specials/menu_item");
     </ script >
</ head >

< body >

     <!-- Create the Spry dynamic region -->
     < div  id ="Specials_DIV"  spry:region ="dsSpecials" >
     <!-- Display the data in a table -->
         < table  id ="Specials_Table" >
         < tr >
             < th > 名称 </ th >
             < th > Description </ th >
             < th > 价格 </ th >
        </ tr >
         < tr  spry:repeat ="dsSpecials" >
             < td > {item} </ td >
             < td > {description} </ td >
            < td > {price} </ td >
         </ tr >
         </ table >
    </ div >

</ body >