HTML中的数据绑定（Data Binding）

有没想过在javascript中使用recordset？原来在客户端操作数据也可以这样简单，定义一个数据源，将数据绑定在各种tag上，实现应用程序般的效果，酷毙了！（首先申明一点，文章的内容全部来自msdn，不过用我自己的话总结而已。）

先看看这样两个例子：
http://msdn.microsoft.com/workshop/samples/author/databind/dbevts.htm
http://msdn.microsoft.com/workshop/samples/author/databind/dbupdate.htm
不得不又一次佩服微软。

这个是DataBinding的架构：




当然实现数据绑定有下面几步：

第一步，定义数据源
从IE4.0起，就支持下面四种数据源：

Tabular Data Control (TDC)

TDC提供了一个简单的访问带有格式的文本数据的方法，一般是csv文件。
下面是一个简单的示例：

<OBJECT CLASSID="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83"
    ID=dsoComposer WIDTH=0 HEIGHT=0>
    <PARAM NAME="DataURL" VALUE="composer.csv">
</OBJECT>

 

Remote Data Service (RDS)

远程数据服务，直接访问远程服务器端的数据，Internet Explorer 4.0. RDS 通过OLE-DB 或 Open Database Connectivity (ODBC)来实现。

示例：

<OBJECT classid="clsid:BD96C556-65A3-11D0-983A-00C04FC29E33"
    ID=dsoComposer HEIGHT=0 WIDTH=0>
    <PARAM NAME="Server"  VALUE="http://musicserver">
    <PARAM NAME="Connect" VALUE="dsn=music;uid=guest;pwd=">
    <PARAM NAME="SQL"     VALUE="select compsr_name from composer">
</OBJECT>

不过感觉有点安全性的问题，因为客户端能看到这段代码。

XML Data Source

XML就不多说了，在IE4.0中这样使用：
<APPLET
    CODE="com.ms.xml.dso.XMLDSO.class"
    ID="xmldso"
    WIDTH="0"
    HEIGHT="0"
    MAYSCRIPT="true">
    <PARAM NAME="URL" VALUE="composer.xml">
</APPLET>

Internet Explorer 5以上可以这样：

<!--[if gte IE 5]>
<XML ID="xml1">
<topic-info>
    <page-type>reference</page-type>
    <member-type>property</member-type>
    <persistent-name>ACCESSKEY</persistent-name>
    <runtime-name readable="1" writeable="1">accessKey</runtime-name>
    <abstract>Sets or retrieves the accelerator key for the object.</abstract>
</topic-info>
</XML>
<![endif]-->

另外IE还提供了一个XML数据岛的概念：