利用XML超级COOKIE建立收藏站点列表
在网页中存储用户的资料按照传统的方式是很复杂的：你必须编写服务器端的代码来存储、取出和利用用户的数据。标准的COOKIES提供了一个简单的方法，但它所存储的数据是非常有限的，Internet Explorer 5.0+ 提供了一个更方便的方法，允许您的网站存储的数据高达640K（可分成存储64K的任意数目的文件），这些文件是XML格式的，使用XML DOM（XML Document Object Model）来使用这些用户数据比标准的COOKIES方式要容易的多！
现在就介绍一个简单的例子；创建自己喜欢的站点列表。这个站点列表允许用户通过简单的点击动作来添加和显示自己的信息。这个站点列表和基于浏览器的收藏夹（或书签）没有任何关系，而只是一个自己喜欢的站点的书签。
为了能让XML数据永久存在，你必须在你的文档中使用IE5+的用户数据行为（User Data Behavior）。对于这个例子，我们把这个行为用到自定义的元素上。要定义自定义元素，首先要做的是为这些元素定义名字空间。对于这个例子，定义SITEINFO名字空间。声名如下：
<HTML XMLNS:SITEINFO>
现在我们在SITEINFO名字空间里使用各元素，其方法就是指定名字空间和元素名。我们定义FAVOTITES元素如下：
<SITEINFO:FAVORITES ID="siteFavorites"/>
注意：上面的代码以“/>”结尾，表明此元素没有结束标记，是空元素。所有的自定义元素必须符合XML的格式要求。
下一步就是把用户数据行为和自定义的元素联系到一起。在IE5+里，行为是通过CSS和行为属性跟指定的元素联系在一起。下面就是把用户数据行为和FAVORITES元素联系在一起的语法。
<STYLE>
SITEINFO\:FAVORITES {behavior:url('#default#userData')"}
</STYLE>
为了存储用户喜欢的站点的URL和TILTE，我们创建一个简单的XML文档，结构如下：
<ROOTSTUB>
<SITEINFO>
<URL>http://lucky.myrice.com</URL>
<TITLE>孟宪会之精彩世界</TITLE>
</SITEINFO>
</ROOTSTUB>
接下来，我们编写完成要求的脚本，我们的脚本包括2个函数：AddFavorite和ListFavorites。函数AddFavorite有2个参数，分别代表URL和TITLE。当调用此函数时，此函数载入XML文件，向其中追加数据块，然后保存到磁盘。
function AddFavorite(sURL, sTitle) {
// 调入XML文件
siteFavorites.load("favorites")// 访问此文件
var oXMLDoc=siteFavorites.XMLDocument;// 创建3个元素
var oNode=oXMLDoc.createNode(1,"SITEINFO", "");
var oURLNode=oXMLDoc.createNode(1,"URL", "");
var oTitleNode=oXMLDoc.createNode(1,"TITLE", "");// 设定URL和TITLE
oURLNode.text=sURL;
oTitleNode.text = sTitle// 追加URL和TITLE
oNode.insertBefore(oURLNode,null)
oNode.insertBefore(oTitleNode,null)//把新的SITEINFO块添加到XML文件
oXMLDoc.documentElement.insertBefore(oNode, null);// 保存文件
siteFavorites.save("favorites")
}
这个函数的使用非常简单，我们这里用按钮来添加自己喜欢的站点。
<input onClick='AddFavorite("http://www.sohu.com.cn/","sohu")' type=button value="sohu" name="button">
<input onClick='AddFavorite("http://lucky.myrice.com","【孟宪会之精彩世界】")' type=button value="【孟宪会之精彩世界】" name="button1">
<input onClick='AddFavorite("http://www.sina.com.cn","新浪网")' type=button value="新浪网" name="button2">
<input onClick='AddFavorite("http://www.sohu.com","sohu")' type=button value="sohu" name="button3">
您添加完自己喜欢的站点以后，可以用ListFavorites()函数来显示我们的选择，此函数把我们的选择输出到一个新的窗口内：
function ListFavorites() {
//打开一个新窗口
var wList = window.open("","fav","width=300,height=200,top=0,left=0,scrollbars=yes")
wList.document.open()
wList.document.write("<TITLE>喜爱的列表</TITLE>")
wList.document.write("<BASE TARGET=\"_blank\">")// 载入文件
siteFavorites.load("favorites")// 找到跟节点
var oXMLDoc = siteFavorites.XMLDocument.documentElement//遍历每一个SITEINFO块
for (var i=0;i<oXMLDoc.childNodes.length;i++) {
// 输出
with (wList.document) {
write("<A HREF=\"" + oXMLDoc.childNodes[i].childNodes[0].text + "\">")
write(oXMLDoc.childNodes[i].childNodes[1].text)
write("</A><BR>")
}
}
wList.document.close()
}
要显示你的XML源文件，可以通过下面的方法来实现：
<input onClick="output.value = RawFavorites()" type=button value="查看源文件" name="button">
<textarea name=output rows=15 cols=40></textarea>
这个列表现在已经永久地保存到你的计算机内，即使你关闭浏览器，清空COOKIES，当你再次打开此文件时，这些数据你仍可以看到。
这里只是向您提供一种用XML永久存储用户数据的方法，需要说明的是，本文所创建的XML文件只有从来自同一域名的页面所得到，因此，本文的例子对你所有的页面并不适用，你还得做点进一步的工作，使之完全满足你的需要。此外，你还可以添加删除、排序等额外的功能。
下面我们给出全部例子的源代码，直接拷贝即可：
<HTML XMLNS:SITEINFO>
<HEAD>
<TITLE></TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
<STYLE>
SITEINFO\:FAVORITES {BEHAVIOR: url('#default#userData')"}
</STYLE>
<SITEINFO:FAVORITES id=siteFavorites></SITEINFO:FAVORITES>
<SCRIPT>
function AddFavorite(sURL, sTitle) {
siteFavorites.load("favorites")
var oXMLDoc=siteFavorites.XMLDocument;
var oNode=oXMLDoc.createNode(1,"SITEINFO", "");
var oURLNode=oXMLDoc.createNode(1,"URL", "");
var oTitleNode=oXMLDoc.createNode(1,"TITLE", "");
oURLNode.text=sURL;
oTitleNode.text = sTitle
oNode.insertBefore(oURLNode,null)
oNode.insertBefore(oTitleNode,null)
oXMLDoc.documentElement.insertBefore(oNode, null);
siteFavorites.save("favorites")
}function RawFavorites() {
siteFavorites.load("favorites")
return siteFavorites.XMLDocument.documentElement.xml
}function ListFavorites() {
siteFavorites.load("favorites")
var oXMLDoc = siteFavorites.XMLDocument.documentElement
var wList = window.open("","fav","width=300,height=200,top=0,left=0,scrollbars=yes")
wList.document.open()
wList.document.write("<TITLE>我喜爱的站点</TITLE>")
wList.document.write("<BASE TARGET=\"_blank\">")for (var i=0;i<oXMLDoc.childNodes.length;i++) {
with (wList.document) {
write("<A HREF=\"" + oXMLDoc.childNodes[i].childNodes[0].text + "\">")
write(oXMLDoc.childNodes[i].childNodes[1].text)
write("</A><BR>")
}
}
wList.document.close()
}
</SCRIPT>
</HEAD>
<BODY>
<p>请在您喜爱的站点上点击按钮：<br>
<input onClick='AddFavorite("http://www.yahoo.com.cn/","yahoo中国")' type=button value="yahoo中国"><br>
<input onClick='AddFavorite("http://lucky.myrice.com","【孟宪会之精彩世界】")' type=button value="【孟宪会之精彩世界】"><br>
<input onClick='AddFavorite("http://www.sina.com.cn","新浪网")' type=button value="新浪网"><br>
<input onClick='AddFavorite("http://www.21cn.com/","21cn.com")' type=button value="21cn.com"><br><br><br>
<input onClick=ListFavorites() type=button value="列出你喜欢的站点"><br><br><br>
<input onClick="output.value = RawFavorites()" type=button value="刷新收藏列表源文件"><br>
<textarea name=output rows=15 cols=40></textarea>
</BODY>
</HTML>