首頁 > 開發者 > 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 Code1<!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>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
