一、localStorage

　　用於長久儲存整個網站的資料，儲存的資料沒有過期時間，直到手動去刪除；

　　一般最大可儲存5M資料，並且支援跨域隔離，localStorage滿了的情況下仍繼續儲存並不會覆蓋其他的值，而是直接報錯(QuotaExceededError)，並且當前儲存的值也會被清空。

　　儲存資料語法：

localStorage.setItem("key", "value");

　　讀取資料語法：

var lastname = localStorage.getItem("key");

　　刪除資料語法：

localStorage.removeItem("key");

　　刪除所有資料：

localStorage.clear();

另外一種儲存、讀取和刪除的方法：

// 儲存
localStorage.name = 'lj';
// 讀取
localStorage.name; // lj
// 刪除
delete localStorage.name;
// 清除全部
localStorage.clear();

// 遍歷
for (let i = 0; i < localStorage.length; i++) {
    const key = localStorage.key(i); // 獲取本地儲存的Key
    console.log(localStorage[key]); // 獲取本地儲存的value
 

}

二、sessionStorage

　　該資料物件臨時儲存同一視窗(或標籤頁)的資料，在關閉視窗或標籤頁之後將會刪除這些資料。

　　假設你在A頁面儲存了sessionStorage，新開選項卡將A頁面的連結貼上進去開啟頁面，sessionStorage也是不存在的。

所以sessionStorage存在的條件是頁面間的跳轉，A頁面儲存了sessionStorage，他要通過超連結或者location.href或者window.open來開啟另一個同域頁面才能訪問sessionStorage。

　　儲存、讀取和刪除的方法同localStorage的用法

三、cookie

　　cookie在設定的時候如果不設定過期時間，就表示是個會話cookie，

　　Cookie 是一些資料, 儲存於你電腦上的文字檔案中。

　　當 web 伺服器向瀏覽器傳送 web 頁面時，在連線關閉後，服務端不會記錄使用者的資訊。

　　Cookie 的作用就是用於解決 "如何記錄客戶端的使用者資訊"。

　　/*描述:

　　新建一條Cookie,交由瀏覽器管理!

　　引數說明:

　　name - 鍵值對的鍵,唯一標記一個值

　　value - 鍵值對的值,cookie儲存的內容

　　expdays - cookie過期時間(有效時間)

　　*/

 //新增cookie
function setCookie(name, value, expdays) {
    var expdate = new Date(); //設定Cookie過期日期
    expdate.setDate(expdate.getDate() + expdays); //新增Cookie
    document.cookie = name + "=" + escape(value) + ";expires=" + expdate.toUTCString();
}


// 獲取cookie
function getCookie(name) { //獲取name在Cookie中起止位置
    var start = document.cookie.indexOf(name + "=");
    if (start != -1) {
        start = start + name.length + 1; //獲取value的終止位置
        var end = document.cookie.indexOf(";", start);
        if (end == -1) end = document.cookie.length; //截獲cookie的value值,並返回
        return unescape(document.cookie.substring(start, end));
    }
    return "";
}


//刪除cookie
function delCookie(name) {
    setCookie(name, "", -1);
}