XML 應用程序
這一節示範了一個小型的XML應用程序框架。
從XML文檔開始
首先我們建立一個簡單的XML文檔。
來看一下我們原始的XML文檔,描述了CD目錄。
<?xml version="1.0" encoding="ISO-8859-1"?> <CATALOG> <CD> <TITLE>Empire Burlesque</TITLE> <ARTIST>Bob Dylan</ARTIST> <COUNTRY>USA</COUNTRY> <COMPANY>Columbia</COMPANY> <PRICE>10.90</PRICE> <YEAR>1985</YEAR> </CD> . . ... more ... . |
如果你使用IE5.0或者更高版本r, 瀏覽完整的XML文檔。
將XML文檔載入數據島
數據島可以訪問XML文件。
通過數據島,可以把XML文檔引入到HTML頁面中。
<xml src="cd_catalog.xml" id="xmldso" async="false"> </xml> |
使用上面示例代碼,可以把cd_catalog.xml文件載入一個叫"xmldso"的數據島中。屬性async="false"的作用是在HTML處理器開始處理XML數據以前,必須確保XML文檔中的所有數據都被載入到內存中。
把XML數據綁定到HTML的表格元素中
HTML中的table元素可以用來顯示XML數據。
爲了使你的XML數據能在HTML頁面中顯示出來,必須把的數據島綁定到一個HTML元素上。
把XML數據綁定到table元素,需要在table屬性添加一個資源屬性,並且在span元素中添加字段屬性:
<table datasrc="#xmldso" width="100%" border="1"> <thead> <th>Title</th> <th>Artist</th> <th>Year</th> </thead> <tr align="left"> <td><span datafld="TITLE"></span></td> <td><span datafld="ARTIST"></span></td> <td><span datafld="YEAR"></span></td> </tr> </table> |
如果你使用的是IE5.0或者更高版本: 觀看數據島綁定的實例
把數據島綁定到<span> 或者<div> 元素上
<span>或<div>元素都可以用來顯示XML數據。
沒有必要使用table元素來顯示XML數據,數據可以通過數據島綁定到任何一個HTML元素上。
所要做的就是在你得頁面中添加一些<span> 或者<div>元素,使用數據資源屬性把每一個元素和XML文檔元素綁定起來,就象下面這樣:
<br />Title: <span datasrc="#xmldso" datafld="TITLE"></span> <br />Artist: <span datasrc="#xmldso" datafld="ARTIST"></span> <br />Year: <span datasrc="#xmldso" datafld="YEAR"></span> |
或者象這樣的形式:
<br />Title: <div datasrc="#xmldso" datafld="TITLE"></div> <br />Artist: <div datasrc="#xmldso" datafld="ARTIST"></div> <br />Year: <div datasrc="#xmldso" datafld="YEAR"></div> |
如果你使用IE5.0或者更高版本: 觀看數據綁定到HTML元素上的實例。
注意如果你使用<div>元素,數據將會顯示在新的一行裏。
上面的例子,可以看到XML數據都顯示在一行裏。如果要控制數據換行,就必須在你的代碼裏添加一些腳本程序。
爲你的XML數據添加導航腳本
可以通過腳本程序來實現導航功能。
添加數據島方法,使用腳本函數movenext() 和 moveprevious() 來實現導航功能。
<script type="text/javascript"> function movenext() { x=xmldso.recordset if (x.absoluteposition < x.recordcount) { x.movenext() } } function moveprevious() { x=xmldso.recordset if (x.absoluteposition > 1) { x.moveprevious() } } </script> |
如果你使用IE5.0或者更高版本:觀看具有導航功能的XML數據綁定實例。
小結
如果你有創造力的話就可以編寫出非常完善的應用程序。
如果你使用在這一頁中學到的知識,在發揮一下想象力,就可以輕易的創造出完善的應用程序。
如果你使用IE5.0或者更高版本:觀看一個做了一些修改的數據綁定實例。