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

js實現對cookie的增刪改查

簡單來說Cookie是以鍵值對的形式儲存的(Key=Value),各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:
function setCookie(){
   		var cookieName="test";			//cookie名稱
   		var cookieValue = "testValue";	//cookie值
   		var expires = "1";				//過期時間,此處設定有效期為1天 (不設定的話,瀏覽器關閉後此cookie將丟失)
   		var time = new Date();
   		time.setTime(time.getTime+expires*24*60*60*1000);
   		document.cookie = cookieName+"="+escape(cookieValue)+ ";expires=" + time.toGMTString();
   	}

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

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

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

  • 修改cookie:

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

  • 獲取cookie:
function getCookie(cookieName){
	   	var arr;
	   	var reg = new RegExp("(^| )" + cookieName + "=([^;]*)(;|$)");
	   	arr = document.cookie.match(reg)
	  	return unescape(arr[2]);
		
   	}

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

  • 刪除cookie:

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

function delCookie() {
 	 var cookieName = "test";			//cookie名稱
   	 var exp = new Date();
   	 exp.setTime(exp.getTime() - 1);	//設定有效時間為過去的時間
   	 var cval=getCookie(cookieName);    //獲取cookie資訊
   	 if (cval!=null) {
   	 	document.cookie= cookieName+"=" + cval + ";expires=" + exp.toGMTString();//重新設定cookie的有效時間
   	 }
   	}
  • 設定可訪問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";

好了  以上是鄙人的一點認識,如果哪裡有什麼不對的,還望各位大神留言指出,小弟感激不盡並加以改正,抱拳了各位!