1.本地存儲
本地存儲是一個window的屬性，包括localStorage和sessionStorage，允許在瀏覽器中存儲 key/value 對的數據。
localStorage：用於長久保存整個網站的數據，保存的數據沒有過期時間，直到手動去刪除。
sessionStorage：伴隨着session，該數據對象臨時保存同一窗口(或標簽頁)的數據，在關閉窗口或標簽頁之后將會刪除這些數據。
存儲位置（以Chrome為例）：C:\Users\用戶名\AppData\Local\Google\Chrome\User Data\Default\Local Storage。
2.瀏覽器要求
支持本地存儲，所需的瀏覽器版本：
官方建議是每個網站將本地存儲的大小控制在：5MB以內。
如何判斷瀏覽器是否支持本地存儲？
if(!window.localStorage){
alert('This browser does NOT support localStorage');
}本文將以localStorage為例進行說明。
3.localStorage用法
localStorage拓展了cookie的4K限制，可以將所需數據直接存儲到本地，相當於一個 5M 大小的針對於前端頁面的數據庫，相比於 cookie 可以節約帶寬；
我們可以把它簡單理解為：前端數據庫；
另外，本地存儲只能存字符串string，任何格式存儲的時候都會被自動轉為字符串，所以讀取的時候，需要自己進行類型的轉換。
以chrome瀏覽器為例，如何查看網頁的本地存儲？
f12調出開發者工具--》Application--》Storage--》就看可以看到：本地存儲和會話存儲啦；
需要點擊對應的網頁，才能顯示該網頁下的詳細數據存儲。
新增&修改數據的3種方式：
方式1
localStorage.key1=value1;直接在控制台，輸入上述代碼即可。
我們可以看到：我第1次存儲的時候，由於沒有將值轉字符串，所以，js將它當成了變量。
方式2
localStorage['key2']='value2';
這次調用報錯，是因為：不該在[]前加.點。
方式3（推薦使用）
localStorage.setItem('key3','value3');
這次，控制台輸出：未定義undefined，不用管，已經存儲成功了。
說明：上面的3種方式，如果原來的key不存在時，就是新增；key已經存在時，就是修改。
獲取數據的3種方式：
方式1
localStorage.key方式2
localStorage['key']方式3（推薦使用）
localStorage.getItem('key')
清除數據的2種方式：
方式1
localStorage.removeItem('key')說明：返回undefined，不用管，可以成功刪除。
此時，我們可以看到：本地數據里，name3的鍵值對已經被移除了。
方式2
localStorage.clear()說明：返回undefined，不用管，可以成功清空所有數據。
此時，我們可以看到：本地數據已經被清空了。
獲取key和value的另一種方式
獲取key
localStorage.key(index)獲取value
localStorage.getItem(localStorage.key(index))獲取所有的key、value
for (var i = 0; i < localStorage.lenth; i++) {
document.write(localStorage.key(i) + ':' + localStorage.getItem(localStorage.key(i)));
}如何存取json數據？
存儲json數據；
用JSON.stringify()，將json對象轉json字符串。
var json = {'name':'Marydon'};
localStorage.setItem('NAME', JSON.stringify(json));獲取json數據；
用JSON.parse()，將json字符串轉json對象。
補充一句：我們可以通過瀏覽器對這些存儲的本地數據進行：新增、修改和刪除操作。
寫在最后
哪位大佬如若發現文章存在紕漏之處或需要補充更多內容，歡迎留言！！！