javascript之数据存储
数据存储脚本化，我们用到比较多的是cookie和userData。
首先介绍下cookie。
cookie是浏览器提供给客户端存储少量数据的一种持久化对象之一。
cookie的生命周期可以长于浏览器Window对象。
我们可以通过Document的cookie属性来操作cookie对象，但这个对象是一个“单例
”，即它在浏览器实例中是唯一的。
cookie包括的属性
1、exspire 这个属性指定cookie的生存期。expire = date; 这里的date的格式只能是GMT或UCT格式。
可以这样写：var expireTime = new Date(); expire = expireTime.toGMTString();
2、path属性指定与cookie关联在一起的网页。默认为创建cookie的网页，若要使某个服务器域都能使用这个cookie，可以指定path = "/";
例外指定domain可以指定cookie在当前服务器下某个子域使用。
3、secure属性指定网络传输cookie的方式，为bool值。当为false时，表示以不安全的HTTP协议连接传输，为ture时以HTTPS或其他安全协议进行传输。
操作cookie
document的cookie属性以一定的字符串格式进行设置。例 name=value;expire=date;path=path;domain=domain;secure=Boolean;
要改变cookie的值只要使用同一个名字和新的值即可，删除cookie只要设置过期日期即可。操作实例
该实例通过cookie获取输入前次输入的姓名，显示不同的欢迎语句。
View Code
1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2<html xmlns="http://www.w3.org/1999/xhtml">
3<head>
4<meta http-equiv="Content-Type" content="text/html; charset=gb2312"/>
5<title>无标题文档</title>
6</head>
7
8<body>
9<h1>
10<script type="text/javascript">
11 function getCookie(name)
12 {
13 var cookies = document.cookie.split(";");
14
15 for(var i = 0 ;i<cookies.length;i++)
16 {
17 var s = cookies[i].split("=");
18 if(s[0].replace(/\s+/g,"") == name) return s[1];
19 }
20 }
21
22 function setCookie(name,value,expireTime)
23 {
24 var expireTime = expireTime ? "expire = " + expireTime.toGMTString() : "";
25 document.cookie = name + "=" + value +";" + expireTime;
26 }
27
28 var lastPersonName = getCookie("$name$") || "";
29
30 var name = prompt("请输入您的姓名：",lastPersonName);
31
32 var times = getCookie(name) || 0;
33
34 setCookie(name,times - 0 + 1);
35
36 setCookie("$name$",name);
37
38 if(times>0)
39 {
40 document.write("Hello "+name+",Nice to meet you again.");
41 } else {
42
43 document.write("Hello "+name+".");
44
45 }
46
47
48 </script>
49
50</h1>
51
52
53</body>
54</html>
接下来介绍userData。
userData通过将数据写入UserData存储区进行存储。该数据将一直存在，除非人为删除。
userData的声明
*************************************知识点来自月影《王者归来》***********************************
第一种方法：<style>.userData{behavior:url('#defaule#userData')} </style>
第二种方法：object.style.behavior = "url('#defaule#userData')"
userData的属性和方法
expires指定失效日期，同cookie一样。
setAttribute()设置属性值。形式：setAttribute("AttributeName",value);
save()将对象数据保存到UserData存储区中。形式：save("userDataName");
load()从UserData中载入存储的数据。形式：load("userDataName");
getAttribute()获取指定的属性值。形式：getAttribute("AttributeName");
操作userData实例
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style>.userData{behavior:url(#default#userData);}</style>
<script type="text/javascript">
<!--
function fnSave()
{
var content = document.getElementById('content');
var expireTime = new Date()
expireTime.setFullYear(expireTime.getFullYear() + 1);
content.expire = expireTime.toGMTString();
content.setAttribute("inputContent",content.value);
content.save("cUserData");
}
function fnLoadInput()
{
var content = document.getElementById('content');
content.load("cUserData");
content.value = content.getAttribute("inputContent");
}
-->
</script>
</head>
<body>
<input class="userData" type="text" id="content" />
<button value="save" onclick="fnSave()">Save</button>
<button value="load" onclick="fnLoadInput()" >Load</button>
</body>
</html>
