在HTML5中，除了CANVAS元素辜羊，另外一個(gè)新增的非常重要功能就是可以在本地客戶端儲(chǔ)存數(shù)據(jù)的Web Storage功能臣淤。
在HTML4 我們是使用的cookies在客戶端保存用戶名等等一些簡單的用戶信息。
cookies的缺點(diǎn)：
1）、大小限制在4KB鸥滨；
2）肴盏、帶寬浪費(fèi)；
3）威沫、難以操作；
為了解決這樣的一些問題洼专，在HTML5中重新提供了在客戶端保存數(shù)據(jù)的功能棒掠，他就是我們的“Web Storage”。
這個(gè)小章節(jié)我們來簡單了解屁商，sessionStorage和localStorage之間的區(qū)別烟很，掌握兩者的基本用法。
1蜡镶、sessionStorage臨時(shí)保存
就是把數(shù)據(jù)保存在session對象之中雾袱。
session就是在打開網(wǎng)站到關(guān)閉網(wǎng)站之間要求進(jìn)行保存的數(shù)據(jù)。
sessionStorage
臨時(shí)保存的用法：
sessionStorage.setitme('key','value');
//或者是sessionStorage.key = 'value';
臨時(shí)數(shù)據(jù)讀取的方法：
變量=sessionStorage.getItem（'key'）
//或者是sessionStorage.key;
2官还、localStorage永久保存
就是將數(shù)據(jù)保存在客戶端本地的硬件設(shè)備至上面芹橡，如果瀏覽器被關(guān)閉，這個(gè)數(shù)據(jù)不會(huì)丟失望伦，下次打開可以繼續(xù)使用林说。這個(gè)功能就是我們的localStorage永久保存功能煎殷。
localStorage
永久保存數(shù)據(jù)的方法：
localStorage.setItem（'key','value'）;
//或者
localstorage.key;
讀取的方法：
變量=localStorage.getItem（'key'）;
//或者
變量=localStorage.key;
2、實(shí)戰(zhàn)簡單的訪客留言板
制作留言板需要使用到的函數(shù)有3個(gè)
1腿箩、saveStorage函數(shù)
使用“new Date().getTime()”語句來獲取當(dāng)前的日期和時(shí)間戳豪直，然后使用localStorage.setItem將獲取到的時(shí)間戳作為鍵值，并將文本框中的數(shù)據(jù)作為鍵名進(jìn)行保存珠移。保存后使用loadStorage函數(shù)在頁面上顯示保存后的數(shù)據(jù)弓乙。
2、loadStorage函數(shù)
這個(gè)函數(shù)取得保存后的所有數(shù)據(jù)钧惧，然后以表格的形式進(jìn)行顯示唆貌。
兩個(gè)重要的屬性：
1）、loadStorage.length
所有保存在localStorage中的數(shù)據(jù)條數(shù)垢乙。
2）锨咙、localStorage.key（index）
想要得到的數(shù)據(jù)的索引號作為index參數(shù)傳入，可以得到得到localStorage中與這個(gè)索引號對應(yīng)的數(shù)據(jù)追逮。
3）酪刀、clearStorage函數(shù)
將保存在localStorage中的數(shù)據(jù)全部清除。
用法：localStorage.clear();
