標籤：style http color io 使用 ar java for sp
今天把javascript如何用來建立及儲存cookie複習了一下，其中的一點體會拿出來和大家討論，首先看一下基礎知識：
什麼是cookie
cookie 是儲存於訪問者的電腦中的變數。每當同一台電腦通過瀏覽器請求某個頁面時，就會發送這個 cookie。你可以使用 JavaScript 來建立和取回 cookie 的值。
有關cookie的例子
- 名字 cookie： 當訪問者首次訪問頁面時，他或她也許會填寫他/她們的名字。名字會儲存於 cookie 中。當訪問者再次訪問網站時，他們會收到類似 "Welcome John Doe!" 的歡迎詞。而名字則是從 cookie 中取回的。k7娛樂城
- 密碼 cookie： 當訪問者首次訪問頁面時，他或她也許會填寫他/她們的密碼。密碼也可被儲存於 cookie 中。當他們再次訪問網站時，密碼就會從 cookie 中取回。
- 日期 cookie： 當訪問者首次訪問你的網站時，當前的日期可儲存於 cookie 中。當他們再次訪問網站時，他們會收到類似這樣的一條訊息："Your last visit was on Tuesday August 11, 2005!"。日期也是從 cookie 中取回的。
下面來建立一個cookie的執行個體，如何來建立cookie及取出cookie。
javascript部分代碼：
view source print?
02 |
function setCookie(name, value, expireday) { |
04 |
exp.setTime(exp.getTime() + expireday*24*60*60*1000); //設定cookie的期限 |
05 |
document.cookie = name+"="+escape(value)+"; expires"+"="+exp.toGMTString();//建立cookie |
08 |
function getCookie(name) { |
09 |
var cookieStr = document.cookie; |
10 |
if(cookieStr.length > 0) { |
11 |
var cookieArr = cookieStr.split(";"); //將cookie資訊轉換成數組 |
12 |
for (var i=0; i<cookieArr.length; i++) { |
13 |
var cookieVal = cookieArr[i].split("="); //將每一組cookie(cookie名和值)也轉換成數組 |
14 |
if(cookieVal[0] == name) { |
15 |
return unescape(cookieVal[1]); //返回需要提取的cookie值 |
21 |
function checkCookie() { |
22 |
var cookieUser = document.getElementById("cookieUser"); |
23 |
var userName = getCookie("userName"); |
25 |
cookieUser.innerHTML = "您好"+userName+"，歡迎再次回來！"; |
27 |
var value = prompt("請輸入使用者名稱", ""); |
29 |
setCookie(‘userName‘, value, 1); |
主要在於如何提取我們需要的cookie資訊，在本例的getCookie函數中主要是將cookie資訊轉化成數組的方式來尋找我們需要提取的cookie值。還可以通過Regex的方式來匹配，如下：
view source print?
1 |
function getCookie(name) { |
2 |
var cookieStr = document.cookie; |
3 |
var cookieArr = cookieStr.match(new RegExp(name+"=[a-zA-Z0-9]*;$")); |
4 |
var cookieVal = cookieArr.split("="); |
5 |
if(cookieVal[0] == name) { |
6 |
return unescape(cookieVal[1]); |
比如在這個例子中，如果開啟瀏覽器中沒有儲存名為userName的cookie，則會提示使用者輸入使用者名稱，再次重新整理頁面時則會顯示輸入的cookie值。 最後我們可以測試一下代碼：
view source print?
1 |
<body onload="checkCookie()"> |
2 |
<p id="cookieUser"></p> |
cookie 是儲存於訪問者的電腦中的變數
