本文章記錄本人在學習 Cookie 中看書理解到的一些東西,加深記憶和并且整理記錄下來,方便之后的復習。
封裝函數
在默認的情況下存取Cookie是一件比較麻煩的事情。由于Cookie是通過字符串來存儲信息的,所以容易導致在執行賦值運算的時需要轉換讀取信息的數據類型。而且Cookie信息的字符串本身就令人討厭,在經常使用Cookie信息的 Web 應用中格外的不方便。所以需要自行的封裝一個Cookie函數來提供開發效率!
定義一個函數Cookie(),這個函數能夠寫入指定的Cookie信息,刪除指定的Cookie信息,也能夠讀取指定名稱的Cookie值,另外,在該函數中還可以制定Cookie信息的有效期、有效路徑、作用域和安全性選項設置。完整的代碼:
var Cookie = function(name, value, options) { // 如果第二個參數存在 if (typeof value != 'undefined') { options = options || {}; if (value === null) { // 設置失效時間 options.expires = -1; } var expires = ''; // 如果存在事件參數項,并且類型為 number,或者具體的時間,那么分別設置事件 if (options.expires && (typeof options.expires == 'number' || options.expires.toUTCString)) { var date; if (typeof options.expires == 'number') { date = new Date(); date.setTime(date.getTime() + (options.expires * 24 * 60 * 60 * 1000)); } else { date = options.expires; } expires = '; expires=' + date.toUTCString(); } var path = options.path ? '; path=' + options.path : '', // 設置路徑 domain = options.domain ? '; domain=' + options.domain : '', // 設置域 secure = options.secure ? '; secure' : ''; // 設置安全措施,為 true 則直接設置,否則為空 // 把所有字符串信息都存入數組,然后調用 join() 方法轉換為字符串,并寫入 Cookie 信息 document.cookie = [name, '=', encodeURIComponent(value), expires, path, domain, secure].join(''); } else { // 如果第二個參數不存在 var CookieValue = null; if (document.cookie && document.cookie != '') { var Cookie = document.cookie.split(';'); for (var i = 0; i < Cookies.length; i++) { var Cookie = (Cookie[i] || "").replace( /^/s+|/s+$/g, ""); if (Cookie.substring(0, name.length + 1) == (name + '=')) { CookieValue = decodeURIComponent(Cookie.substring(name.length + 1)); break; } } } return CookieValue; } };
如何使用
寫入Cookie信息:
// 簡單寫入一條 Cookie 信息cookie("user", "baidu");// 寫入一條 Cookie 信息,并且設置更多選項cookie("user", "baidu", { expires: 10, // 有效期為 10 天 path: "/", // 整個站點有效 domain: "www.baidu.com", // 有效域名 secure: true // 加密數據傳輸});
2.讀取Cookie信息:
cookie("user");
3.刪除Cookie信息:
cookie("user", null);
再給大家分享一個封裝好的代碼
//向cookie寫入數據function writeCookie(name, value, days) { // 定義有效日期(cookie的有效時間) var expires = ""; // 為有效日期賦值 if (days) { var date = new Date(); //設置有效期(當前時間+時間段) date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));//時間段為毫秒數 expires = "; expires=" + date.toGMTString(); } // 給cookie賦值 name, value和expiration date(有效期) document.cookie = name + "=" + value + expires + "; path=/";}//讀取cookie數據function readCookie(name) { var searchName = name + "="; var cookies = document.cookie.split(';'); for(var i=0; i < cookies.length; i++) { var c = cookies[i]; while (c.charAt(0) == ' ') c = c.substring(1, c.length); if (c.indexOf(searchName) == 0) return c.substring(searchName.length, c.length); } return null;}//清楚所有的cookiefunction eraseCookie(name) { // 將時間設置成-1將清除存儲在cookie中的數據 writeCookie(name, "", -1);}
最后,如果文章有什么錯誤和疑問的地方,請指出。與sf各位共勉!
新聞熱點
疑難解答