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