§ ITPOW >> 文档 >> JavaScript >> DOM & DHTML

IE 数据岛(4)

作者：vkvi 来源：ITPOW（原创）日期：2006-5-29

数据岛中在 JavaScript 中也得到了支持，当然这种支持同样也是仅限于 IE 浏览器中的。
看示例：

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>数据岛</title> </head> <body> <xml id="xmlData"> <root> <item> <name>张三</name> <gender>男</gender> </item> <item> <name>李四</name> <gender>男</gender> </item> </root> </xml> <table> <tr> <td>姓名：<input type="text" size="20" datasrc="#xmlData" datafld="name"></td> </tr> <tr> <td>性别：<input type="text" size="20" datasrc="#xmlData" datafld="gender"></td> </tr> <tr> <td> <input type="button" value="第一条" onclick="javascript:xmlData.recordset.moveFirst();"> <input type="button" value="上一条" onclick="javascript:xmlData.recordset.movePrevious();"> <input type="button" value="下一条" onclick="javascript:xmlData.recordset.moveNext();"> <input type="button" value="最后一条" onclick="javascript:xmlData.recordset.moveLast();"> </td> </tr> <tr> <td> <input type="button" value="记录数" onclick="javascript:alert('共有 '+xmlData.recordset.recordCount+' 条记录');"> <input type="button" value="当前位置" onclick="javascript:alert('当前是第 '+xmlData.recordset.absolutePosition+' 条记录');"> <input type="button" value="添加新记录" onclick="javascript:xmlData.recordset.addNew();"> </td> </tr> </table> </body> </html>
[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

我们可以看到程序都比较简单，也比较好理解。查看信息时主要是利用 xml 的四个函数，为了使问题简单，我们并没有加入记录到头或到尾的判断：
recordset.moveFirst()
recordset.movePrevious()
recordset.moveNext()
recordset.moveLast()
可以看出这种效果跟分页大小为 1 的 table 分页效果一样，只是这里的 datasrc 写在 input 里的，而分页时是写在 table 里的。

同时也有几个属性可以了解下
recordset.recordCount 记录数量
recordset.absolutePosition 当前记录的位置，第一条记录的位置是 1

添加记录用
recordset.addNew()
记录是不用保存的，我们只要填了数据，它会自动保存，就如同 Access 等一些数据库软件一样，所以修改记录时直接修改即可。

有趣的是，上面的函数、方法好像都是大小写无关的。

网友评论

瞎掰。首单词全小写，后续单词首字母大写。（121.25.*.* 2007-06-18 20:45:33）（您可以把 moveNext 改为 MOVENEXT，在 IE 中测试一下。不过我还是建议使用您说的命名方法。作者注。）
如何删除数据啊。方法都有哪些？？（221.8.*.* 2007-12-25 15:02:54）

电邮：cftea@126.com