1. 程式人生 > >使用js實現對cookie的增刪改查

使用js實現對cookie的增刪改查

簡單的操作cookie

儲存cookie(key為test;value為testValue): 

document.cookie = "test=testValue";

 

儲存多個cookie:

document.cookie = "test1=testValue1";
document.cookie = "test2=testValue2";

 

獲取cookie:

var getCookie = document.cookie;

 

設定cookie:

//設定cookie
function setCookie(cookieName, cookieValue) {
    var expires = "1"; //過期時間,此處設定有效期為1天
    var exp = new Date();
    exp.setTime(exp.getTime() + expires * 24 * 60 * 60 * 1000); //設定失效時間(不設定的話,瀏覽器關閉後此cookie將丟失)
    document.cookie = cookieName + "=" + escape(cookieValue) + ";expires=" + exp.toGMTString() + ";path=" + "/";
}

注:由於在cookie的名或值中不能使用分號(;)、逗號(,)、等號(=)以及空格。

而在cookie的名中我們可以控制,但要儲存的值是不確定的,怎麼辦呢?

這時就需要用escape()函式進行編碼,它能將一些特殊符號使用十六進位制表示,例如空格將會編碼為“20%”,從而可以儲存於cookie值中,而且使用此種方案還可以避免中文亂碼的出現,取的時候用unescape()函式解碼即可。

修改cookie:
需要修改cookie時,只需要重新複製即可。
 

 

獲取cookie:

//讀取cookie
function getCookie(cookieName){ 
	var arr,reg=new RegExp("(^| )"+cookieName+"=([^;]*)(;|$)");
	if(arr=document.cookie.match(reg))
		return unescape(arr[2]); 
	else 
		return null; 
}

注:當存入多個cookie時,使用document.cookie讀取時會全部取出來,可能我們只是想獲取其中一個(如:test1),這樣的結果不是我們想要的,因此用到了new RegExp()來幫我們過濾,同時使用match()函式來獲取到最終的值,由於存的是編碼後的值,所以需要通過unescape()來進行解碼即可得到我們想要的結果。
 

 

刪除cookie:

其實刪除cookie說白了就是設定cookie的過期時間為過去的一個時間,即讓cookie過期。

//刪除cookie
function delCookie(cookieName ){ 
	var exp = new Date(); 
	exp.setTime(exp.getTime() - 1); 
	var cval=getCookie(cookieName ); 
	if(cval!=null) 
		document.cookie= cookieName  + "="+cval+";expires="+exp.toGMTString()+";path="+"/"; 
}

 

 

設定可訪問cookie的路徑:

cookie_dir表示可以訪問cookie的目錄,使用path屬性可設定其值(設定僅在test目錄下可用):

document.cookie="cookieName=cookieValue; path=/test";

注:path="/"表示cookie在整個網站下都可用

 

設定cookie域:

domain表示cookie所在域,預設為請求的地址,並且預設情況下一個主機中建立的cookie在另一個主機下是不能被訪問的。

如:網址test1.test.com要訪問test2.test.com下的cookie可設定domain引數來實現

document.cookie="cookieName=cookieValue;domain=.test.com";