cookie

我們用變數儲存資料在關閉頁面時會銷燬，如果我們需要一段時間內儲存資料，但又不至於使用後端資料庫去儲存的東西就可以用cookie來儲存。

特點：

• 如果我們想長時間存放一個cookie，需要在設定它的時候同時設定一個過期時間（expires），預設是臨時儲存。
• 該方法在ie裡會有問題，用oDate.toGMTString()（轉化成日期字串）就可以了
• 每次都會攜帶在HTTP頭中，如果使用cookie儲存過多資料會帶來效能問題，因為它們由每個對伺服器的請求來傳遞，這使得 cookie 速度很慢而且效率也不高

封裝一個儲存cookie的方法

function setCookie(key,value,t){
    	var oDate = new Date();
    	oDate.setDate(oDate.getDate()+t); 
        document.cookie = key+'='+encodeURI(value)+';expires='+oDate.toGMTString();
}
 

獲取cookie的方法

function getCookie(key){
    	var arr1 = document.cookie.split('; ');
    	for(var i=0;i<arr1.length;i++){
    	var arr2 = arr1[i].split('=');
    	if(arr2[0]==key){
        	return decodeURI(arr2[1]);}
        }
}

刪除cookie的方法

 function removeCookie(key){
        setCookie(key,'',-1);
 }
 

sessionStorage，localStorage

sessionStorage：針對一個 session 的資料儲存，該儲存區域在頁面會話期間可用，而且它僅在客戶端（即瀏覽器）中儲存，不參與和伺服器的通訊。

localStorage：沒有時間限制的資料儲存，在瀏覽器關閉，然後重新開啟後，除非資料被清除，否則仍然存在

作用域：不同瀏覽器無法共享localStorage或sessionStorage中的資訊。相同瀏覽器的不同頁面間可以共享相同的 localStorage（頁面屬於相同域名和埠），但是不同頁面或標籤頁間無法共享sessionStorage的資訊。這裡需要注意的是，頁面及標籤頁僅指頂級視窗，如果一個標籤頁包含多個iframe標籤且他們屬於同源頁面，那麼他們之間是可以共享sessionStorage的。

清空方法和資料數量

localStorage.clear();  //清空
localStorage.length;   //資料數量

儲存和修改資料

localStorage.setItem("name","str");  //name若存在即為修改，否則為新增  
localStorage.name = "str";

讀取資料

 localStorage.getItem("name");  
 localStorage.name
 localStorage.key(i) 

刪除和檢查是否存在某資料

 localStorage.removeItem("name"); 
 localStorage.hasOwnProperty("name")