web本地存儲sessionStorage和localStorage

本地存儲特性：

1、數據存儲在用戶瀏覽器中

2、設置、讀取方便、甚至頁面刷新不丟失數據

3、容量較大，sessionStorage約5M、localStorage約20M

4、只能存儲字符串，可以將對象JSON.stringify() 編碼後存儲

一、window.sessionStorage

1、生命週期爲關閉瀏覽器窗口

2、在同一個窗口(頁面)下數據可以共享

3、以鍵值對的形式存儲使用

存儲數據：

sessionStorage.setItem(key, value)

獲取數據：

sessionStorage.getItem(key)

刪除數據：

sessionStorage.removeItem(key)

清空數據：(所有都清除掉)

sessionStorage.clear()

二、window.localStorage

1、聲明週期永久生效，除非手動刪除，否則關閉頁面也會存在

2、可以多窗口（頁面）共享（同一瀏覽器可以共享）

3. 以鍵值對的形式存儲使用

存儲數據：

localStorage.setItem(key, value)

獲取數據：

localStorage.getItem(key)

刪除數據：

localStorage.removeItem(key)

清空數據：(所有都清除掉)

localStorage.clear()

案例：可以利用本地存儲完成在登錄時自動填充用戶名的功能：

1. 把數據存起來，用到本地存儲

2. 關閉頁面，也可以顯示用戶名，所以用到localStorage

3. 打開頁面，先判斷是否有這個用戶名，如果有，就在表單裏面顯示用戶名

注意事項： 無論是sessionStorage還是localStorage，clear（）方法不推薦使用，clear是清除所有本地存儲，作用類似於sudo rm -rf /。不跑路的還是少碰吧。