站内搜索: 请输入搜索关键词

当前页面: 开发资料首页Javascript 专题简易的客户端数据库----Tabular Data Control

简易的客户端数据库----Tabular Data Control

摘要: 简易的客户端数据库----Tabular Data Control


Tabular Data Control(TDC):这是一种简单的DSO,提供对格式化文本文件的访问。也就是说,TDC提供的数据来源是用指定分隔符来格式化的文本文件。
它可以适用于所有的ie4.0以上的所有浏览器,此外他还创建了一种不需要服务器端脚本支持的简易数据库(如PHP+MySQL),只是简单的应用客户端脚本如javascript就可以操作TDC了。但是如果你的浏览器是ns的,那么你就必须要安装一个插件已得到同样的效果。<?xml:namespace prefix = o ns = "urn:schemas-microsoft-com:office:office" />

TDC的应用模版:


...
...
...

和applet一样,任何一个object都要有参数,TDC大约有八个参数,在这里我并不想一一介绍,我只介绍其中5重要的参数:

1、DataURL : 你想要读取文本的路径,例如:c:\data.txt

2、UseHeader : 在文件第一行取得所要输出数据的列名

3、TextQualifier: 确定一种包围在你的数据周围的特定符号,例如~zhaoweiwei~,这里就用“~”作为这种符号

4、FieldDelim: 用于分割一行中两个相邻数据的符号

5、RowDelim: 确定一个符号已表示一行的结束,默认值是:换行符

举例如下:


//所要读取数据的文件
//列名

数据以“|”符号分开

YourDataFile.txt内容

name|age~Premshree Pillai~|~19~

下面介绍一下实际的应用及其优点:

假如我想在一个web页中显示一个表格用以存储我的通讯录,但是我又不想每一次再增加新内容或修改以前内容的时候都去修改我的web页,而且这样少的内容也并没有必要动用数据库那样的庞然大物,所以TDC方法就成了我的当然之选。

记住最好把你的*.txt文件和你的web页(*.htm)文件放在同一个目录下,首先我们先建立一个txl.txt文件(依照上面的格式),如下:

name|age|phone|qq|mail

~赵冠楠~|~22~|~1381303698~|~231312~|zhaogn@sina.com

~杨旭~|~22~|~1393023698~|~12256312~|yangx@sina.com

~韩红雷~|~23~|~138136556~|~8297312~|hanghl@sina.com

在这里我只记录了几条信息,为了见解就不再多写了。

然后开始建立我们的web页(tdc_ex.htm)如下:

<table DATASRC="#txl" BORDER="2"> //datasrc就是之所要读取数据的数据源,同开始声明的一样

<thEAD>

<th>姓名 :</th>

<th>年龄 :</th>

<th>电话 :</th>

<th>QQ :</th>

<th>电子邮件 :</th>

</thEAD>

<tr>

<td></td> //代表每一列名字,同 txl.txt文件的第一行对应

<td></td>

<td></td>

<td></td>

<td></td>

</tr>

</table>

最后得出显示结果:

<table class=MsoNormalTable style="BORDER-RIGHT: 1.5pt outset; BORDER-TOP: 1.5pt outset; BORDER-LEFT: 1.5pt outset; BORDER-BOTTOM: 1.5pt outset; mso-cellspacing: 1.5pt" cellPadding=0 border=1> <thEAD> <tr style="mso-yfti-irow: 0"> <td style="BORDER-RIGHT: #d4d0c8; PADDING-RIGHT: 0.75pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 0.75pt; PADDING-BOTTOM: 0.75pt; BORDER-LEFT: #d4d0c8; PADDING-TOP: 0.75pt; BORDER-BOTTOM: #d4d0c8; BACKGROUND-COLOR: transparent">

姓名 :

</td> <td style="BORDER-RIGHT: #d4d0c8; PADDING-RIGHT: 0.75pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 0.75pt; PADDING-BOTTOM: 0.75pt; BORDER-LEFT: #d4d0c8; PADDING-TOP: 0.75pt; BORDER-BOTTOM: #d4d0c8; BACKGROUND-COLOR: transparent">

年龄 :

</td> <td style="BORDER-RIGHT: #d4d0c8; PADDING-RIGHT: 0.75pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 0.75pt; PADDING-BOTTOM: 0.75pt; BORDER-LEFT: #d4d0c8; PADDING-TOP: 0.75pt; BORDER-BOTTOM: #d4d0c8; BACKGROUND-COLOR: transparent">

电话 :

</td> <td style="BORDER-RIGHT: #d4d0c8; PADDING-RIGHT: 0.75pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 0.75pt; PADDING-BOTTOM: 0.75pt; BORDER-LEFT: #d4d0c8; PADDING-TOP: 0.75pt; BORDER-BOTTOM: #d4d0c8; BACKGROUND-COLOR: transparent">

QQ :

</td> <td style="BORDER-RIGHT: #d4d0c8; PADDING-RIGHT: 0.75pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 0.75pt; PADDING-BOTTOM: 0.75pt; BORDER-LEFT: #d4d0c8; PADDING-TOP: 0.75pt; BORDER-BOTTOM: #d4d0c8; BACKGROUND-COLOR: transparent">

电子邮件 :

</td></tr></thEAD> <tr style="mso-yfti-irow: 1"> <td style="BORDER-RIGHT: #d4d0c8; PADDING-RIGHT: 0.75pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 0.75pt; PADDING-BOTTOM: 0.75pt; BORDER-LEFT: #d4d0c8; PADDING-TOP: 0.75pt; BORDER-BOTTOM: #d4d0c8; BACKGROUND-COLOR: transparent">

赵冠楠

</td> <td style="BORDER-RIGHT: #d4d0c8; PADDING-RIGHT: 0.75pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 0.75pt; PADDING-BOTTOM: 0.75pt; BORDER-LEFT: #d4d0c8; PADDING-TOP: 0.75pt; BORDER-BOTTOM: #d4d0c8; BACKGROUND-COLOR: transparent">

22

</td> <td style="BORDER-RIGHT: #d4d0c8; PADDING-RIGHT: 0.75pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 0.75pt; PADDING-BOTTOM: 0.75pt; BORDER-LEFT: #d4d0c8; PADDING-TOP: 0.75pt; BORDER-BOTTOM: #d4d0c8; BACKGROUND-COLOR: transparent">

1381303698

</td> <td style="BORDER-RIGHT: #d4d0c8; PADDING-RIGHT: 0.75pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 0.75pt; PADDING-BOTTOM: 0.75pt; BORDER-LEFT: #d4d0c8; PADDING-TOP: 0.75pt; BORDER-BOTTOM: #d4d0c8; BACKGROUND-COLOR: transparent">

231312

</td> <td style="BORDER-RIGHT: #d4d0c8; PADDING-RIGHT: 0.75pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 0.75pt; PADDING-BOTTOM: 0.75pt; BORDER-LEFT: #d4d0c8; PADDING-TOP: 0.75pt; BORDER-BOTTOM: #d4d0c8; BACKGROUND-COLOR: transparent">

zhaogn@sina.com

</td></tr> <tr style="mso-yfti-irow: 2"> <td style="BORDER-RIGHT: #d4d0c8; PADDING-RIGHT: 0.75pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 0.75pt; PADDING-BOTTOM: 0.75pt; BORDER-LEFT: #d4d0c8; PADDING-TOP: 0.75pt; BORDER-BOTTOM: #d4d0c8; BACKGROUND-COLOR: transparent">

杨旭

</td> <td style="BORDER-RIGHT: #d4d0c8; PADDING-RIGHT: 0.75pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 0.75pt; PADDING-BOTTOM: 0.75pt; BORDER-LEFT: #d4d0c8; PADDING-TOP: 0.75pt; BORDER-BOTTOM: #d4d0c8; BACKGROUND-COLOR: transparent">

22

</td> <td style="BORDER-RIGHT: #d4d0c8; PADDING-RIGHT: 0.75pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 0.75pt; PADDING-BOTTOM: 0.75pt; BORDER-LEFT: #d4d0c8; PADDING-TOP: 0.75pt; BORDER-BOTTOM: #d4d0c8; BACKGROUND-COLOR: transparent">

1393023698

</td> <td style="BORDER-RIGHT: #d4d0c8; PADDING-RIGHT: 0.75pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 0.75pt; PADDING-BOTTOM: 0.75pt; BORDER-LEFT: #d4d0c8; PADDING-TOP: 0.75pt; BORDER-BOTTOM: #d4d0c8; BACKGROUND-COLOR: transparent">

12256312

</td> <td style="BORDER-RIGHT: #d4d0c8; PADDING-RIGHT: 0.75pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 0.75pt; PADDING-BOTTOM: 0.75pt; BORDER-LEFT: #d4d0c8; PADDING-TOP: 0.75pt; BORDER-BOTTOM: #d4d0c8; BACKGROUND-COLOR: transparent">

yangx@sina.com

</td></tr> <tr style="mso-yfti-irow: 3; mso-yfti-lastrow: yes"> <td style="BORDER-RIGHT: #d4d0c8; PADDING-RIGHT: 0.75pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 0.75pt; PADDING-BOTTOM: 0.75pt; BORDER-LEFT: #d4d0c8; PADDING-TOP: 0.75pt; BORDER-BOTTOM: #d4d0c8; BACKGROUND-COLOR: transparent">

韩红雷

</td> <td style="BORDER-RIGHT: #d4d0c8; PADDING-RIGHT: 0.75pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 0.75pt; PADDING-BOTTOM: 0.75pt; BORDER-LEFT: #d4d0c8; PADDING-TOP: 0.75pt; BORDER-BOTTOM: #d4d0c8; BACKGROUND-COLOR: transparent">

23

</td> <td style="BORDER-RIGHT: #d4d0c8; PADDING-RIGHT: 0.75pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 0.75pt; PADDING-BOTTOM: 0.75pt; BORDER-LEFT: #d4d0c8; PADDING-TOP: 0.75pt; BORDER-BOTTOM: #d4d0c8; BACKGROUND-COLOR: transparent">

138136556

</td> <td style="BORDER-RIGHT: #d4d0c8; PADDING-RIGHT: 0.75pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 0.75pt; PADDING-BOTTOM: 0.75pt; BORDER-LEFT: #d4d0c8; PADDING-TOP: 0.75pt; BORDER-BOTTOM: #d4d0c8; BACKGROUND-COLOR: transparent">

8297312

</td> <td style="BORDER-RIGHT: #d4d0c8; PADDING-RIGHT: 0.75pt; BORDER-TOP: #d4d0c8; PADDING-LEFT: 0.75pt; PADDING-BOTTOM: 0.75pt; BORDER-LEFT: #d4d0c8; PADDING-TOP: 0.75pt; BORDER-BOTTOM: #d4d0c8; BACKGROUND-COLOR: transparent">

hanghl@sina.com

</td></tr></table>

这样如想添加新的内容只是在txl.txt中正加一行,就可以显示到web上面了,省去了数据库的应用,这也体现了TDC得优点。

</td> </tr> <tr> <td vAlign=top align=left height="100%">
↑返回目录
前一篇: CSDN无限级树数据库版(ASP+ACCESS)
后一篇: XML在Web中的简单应用