下面代码去掉了ajax的部分,只简单的演示如何生成一个xml数据岛,以及如 何和html表格绑定,并显示出相关的链接信息。其中链接的href内容可以保存在 xml数据中,用datafld属性来处理。
<html xmlns=> <head> <title>XML数据岛</title> </head> <script type=text/jscript>... //获取xml,实际应用中大多是ajax异步获取的 function getData() ...{ var xmlData=<xml ID=xmlData><root>; for(var i=0;i<5;i++) ...{ try ...{ var id=Name+i; var Type=Type+i; xmlData+=<MetaDATA><Name>+id+</Name> ;<Type>+Type+</Type><Href>javascript:aler t('+id+')</Href></MetaDATA>; pointIndex++; } catch(e) ...{ } } xmlData+=</root></xml>; document.all.xmlDataPanel.innerHTML=xmlData; } //简单的添加xml信息 function addData() ...{ var xmlData= document.all.xmlDataPanel.innerHTML; xmlData=xmlData.replace (</root></xml>,); xmlData+=<MetaDATA><Name>newName</Name><Type >newType</Type><Href>javascript:alert('newName') </Href></MetaDATA>; xmlData+=</root></xml>; document.all.xmlDataPanel.innerHTML=xmlData; } </script> <body> <button onclick=javascript:getData();>获取数据 </button> <button onclick=javascript:addData();>添加数据 </button> <div id=xmlDataPanel> </div> <div style=overflow: scroll; height: 180;width:180 align=center> <div align=left> <!--绑定,超链接的地方用 datafld属性,href的值也可以保存在 xml数据岛当中,比较灵活,可以使js函数或者一个URL地址--> <table datasrc=#xmlData border=1> <tr> <td> <a datafld=Href><span datafld=Name></span></a> </td> <td> <span datafld=Type></span> </td> </tr> </table> </div> </div> </body> </html>