js中的cookie的讀寫操作示例詳解

更新時間：2014年04月17日 15:36:24 作者：

cookie是有有效期的，cookie的默認有效期是從cookie生成至瀏覽器關閉，也可以通過設置cookie的有效期來指定其失效日期；用戶也可以禁止cookie也可以手動刪除cookie

cookie是一小段信息，以鍵/值對的信息保存在計算機硬盤上的字符串， cookie存儲容量大概在4kb，不同的瀏覽器廠家對cookie大小的限制有微微的差異；cookie主要的本質(zhì)是“識別”，通過識別來做一些事情;cookie 也是無法從你的硬盤取得任何其它數(shù)據(jù)，傳送電腦病毒或者獲取你的電子郵件地址。cookie是有有效期的，cookie的默認有效期是從cookie生成至瀏覽器關閉，也可以通過設置cookie的有效期來指定其失效日期；用戶也可以禁止cookie也可以手動刪除cookie。

cookie是字符串而且還是一個特定格式的文本字符串

格式：cookieName=cookieValue;expires=expiresDate;path=URLpath;domain=siteDomain//cookie名稱，失效日期，儲存URL,儲存域值；

cookie的創(chuàng)建方式

設置cookie我們一般都封裝成一個函數(shù)：

復制代碼代碼如下:

 
function addCookie(sName,sValue,day) { 
var expireDate = new Date(); 
expireDate.setDate(expireDate.getDate()+day);; 
//設置失效時間 
document.cookie = escape(sName) + '=' + escape(sValue) +';expires=' + expireDate.toGMTString();6 //escape()漢字轉成unicode編碼,toGMTString() 把日期對象轉成字符串 
} 

讀取cookie

添加了cookie之后，我們?nèi)绾蝸慝@取它呢，很簡單：

復制代碼代碼如下:

 
function getCookies() { 
var showAllCookie = ''; 
if(!document.cookie == ''){ 
var arrCookie = document.cookie.split('; '); 
//用spilt('; ')切割所有cookie保存在數(shù)組arrCookie中 
var arrLength = arrCookie.length; 
for(var i=0; i<arrLength; i++) { 
showAllCookie += 'c_name:' + unescape(arrCookie[i].split('=')[0]) + 'c_value:' + unescape(arrCookie[i].split('=')[1]) + '<br>' 9 } 
return showAllCookie; 
} 
} 

cookie有有效期可自動刪除，也可以通過設置其失效日期來立即刪除

一樣很簡單,繼續(xù)：

復制代碼代碼如下:

 
function removeCookie() { 
if(document.cookie != '' && confirm('你想清理所有cookie嗎？')) { 
var arrCookie = document.cookie.split('; '); 
var arrLength = arrCookie.length; 
var expireDate = new Date(); 
expireDate.setDate(expireDate.getDate()-1); 
for(var i=0; i<arrLength; i++) { 
var str = arrCookie[i].split('=')[0]; 
document.cookie = str+ '=' + ';expires=' + expireDate.toGMTString(); 
} 
} 
} 

我們已經(jīng)知道如何創(chuàng)建、獲取、刪除cookie了，現(xiàn)在也該運用cookie了

下面我們用cookie做一個簡單的計時器：

復制代碼代碼如下:

 
var cookieCount = {}; 
cookieCount.count = function () { 
var count = parseInt(this.getCount('myCount')); 
count++; 
document.cookie = 'myCount=' + count + ''; 
alert('第'+count+'訪問'); 
} 
cookieCount.setCount= function () { 
//首先得創(chuàng)建一個名為myCount的cookie 
var expireDate = new Date(); 
expireDate.setDate(expireDate.getDate()+1); 
document.cookie = 'myCount=' + '0' +';expires=' + expireDate.toGMTString(); 
} 
cookieCount.getCount = function (countName) { 
//獲取名為計數(shù)cookie,為其加1 
var arrCookie = document.cookie.split('; '); 
var arrLength = arrCookie.length; 
var ini = true; 
for(var i=0; i<arrLength; i++) { 
if(countName == arrCookie[i].split('=')[0]){ 
return parseInt(arrCookie[i].split('=')[1]); 
break; 
}else{ 
ini = false; 
} 
} 
if(ini == false)this.setCount(); 
return 0; 
} 
cookieCount.count(); 

cookie的路徑

本文開頭的時候提到cookie的路徑設置 cookie的路徑：path=URL;

如果在域名的子目錄創(chuàng)建的cookie，域名及其他同級目錄或上級目錄是訪問不到這個cookie的，而通過設置路徑的好處就是可以上域名以及域名的子類目錄都可以訪問到，如下：

document.cookie='cookieName=cookieValue;expires=expireDate;path=/'。

cookie域

設置域：domain=siteDomain

這個主要用在同域的情況下共享一個cookie，例如 "www.taobao.com" 與 "ued.taobao.com" 兩者是共享一個域名"taobao.com"，我們?nèi)绻胱?"www.taobao.com" 下的cookie被 "ued.taobao.com" 訪問，那么就需要把path屬性設置為 "/"，并且設置 cookie 的domain-->document.cookie='cookieName=cookieValue;expires=expireDate;path=/;domain=taobao.com'。

隨著web的不斷發(fā)展項目中的需要，HTML5提供了兩個屬性window.sessionStorage和window.localStorage,并攜帶了setItem,getItem,removeItem,clear等方法，使得本地存儲數(shù)據(jù)的方法操作更為簡單便利

您可能感興趣的文章: