简介:
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 >
< 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 >
< 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 >