localstorage和sessionstorage上手使用記錄

通過閱讀各路大神對web存儲locastorage和sessionstorage的用法解析，自己試用了一下，在此留個備忘。

在項目中，如果用到很多次storage，要存儲很多資料，就要把它封裝成函數了：

（該函數系不知名大神所寫，如有侵犯原創，請聯系我……）

<code>function</code> <code>setStorage(key,value){</code>

<code>        </code><code>if</code><code>(!window.localStorage){</code>

<code>            </code><code>alert(</code><code>"浏覽器不支援localstorage"</code><code>);</code>

<code>            </code><code>return</code> <code>false</code><code>;</code>

<code>        </code><code>}</code><code>else</code><code>{</code>

<code>            </code><code>var</code> <code>storage=window.localStorage;</code>

<code>            </code><code>//寫入字段</code>

<code>            </code><code>storage.setItem(key,value);</code>

<code>        </code><code>}</code>

<code>    </code><code>}</code>

<code>    </code><code>function</code> <code>getStorage(key){</code>

<code>            </code><code>var</code> <code>key=storage.getItem(key);</code>

<code>//            console.log(key);</code>

<code>            </code><code>return</code> <code>key;</code>

<code>}</code>

setStorage是存儲資料的，key是指定的資料名稱，可以随意起，但是一定要是字元串類型，否則浏覽器自動把值作為key的名字。

wKioL1kjsw6hiN19AAAYL2gTmaY587.png

如圖 第一個值，就是key不是以字元串指定的，即沒有加雙引号。

value值字元串類型的也切記加雙引号。

在浏覽器中如何檢視storage？

較新版本的chrome浏覽器，檢視位置如圖：

wKioL1kjs6bDPXebAABSO9WAEfE668.png

在項目中如果多次調用同樣的存儲資料的函數，則資料會實時改變，如果需要清除所有存儲的資料：

localstorage.clear();或者sessionStorage.clear();

項目中使用的原則就是，哪個資料需要存儲，就用哪個資料調用存數資料的函數。

其他概念，相信其他參考資料已經寫的很詳細透徹了。

http://www.111cn.net/wy/html5/85886.htm

上面這篇寫的不錯，收藏一下。

本文轉自 蓓蕾心晴 51CTO部落格，原文連結：http://blog.51cto.com/beileixinqing/1928518，如需轉載請自行聯系原作者