在HTML5中，除了Canvas元素之外，另一個新增的非常重要的功能是可以再用戶端本地儲存資料的Web Storage功能，之前可以使用Cookies在用戶端
儲存諸如使用者名等簡單使用者資訊，但通過長期使用，人們發現使用Cookies存儲永久資料存在幾個問題。
大小：Cookies的大小被限制在4KB
帶寬：Cookies是随HTTP失誤一起被發送的，是以會浪費一部分發送Cookies時使用的帶寬
複雜性：要正确的操縱Cookies是很困難的。
針對以上問題，HTML5中，重新提供了一中在用戶端本地儲存資料的功能，他就是Web Storage。
顧名思義，Web Storage功能就是在Web上存儲資料的功能，這裡的存儲是針對用戶端本地而言的。具體分為兩種：
sessionStorage：将資料儲存在session對象中。session是指使用者在浏覽某個網站時，從進入網站到浏覽器關閉所經過的這段時間，也就是使用者浏
覽這個網站所花費的時間。session對象可以用來儲存在這段時間内所要儲存的任何資料。
localStorage：将資料儲存在用戶端本地的硬體裝置（硬碟）中，即使浏覽器被關閉了，該資料仍然存在，下一次打開浏覽器通路網站時仍然可以
繼續使用。localstorage 是通過鍵值對來存儲的。
開發工具我使用HBuilder.exe
建立Test.html頁面，代碼如下：
View Code
localStorage關閉浏覽器之後再打開，讀取資料依舊存在，而sessionStorage關閉浏覽器之後再打開讀取資料就不見了。
将Web Storage作為簡易資料庫，如果能解決資料檢索，對列進行管理，就可以将Web Storage作為資料庫來利用了。
建立Register.html頁面，代碼如下：
在HTML5中，大大豐富了用戶端本地可以存儲的内容，添加了很多功能将原本必須要儲存在伺服器上的資料轉為儲存在用戶端本地，進而大大提高了Web應用程式性能，減輕了伺服器的負擔，使用Web時代重新回到了“用戶端為重、伺服器端為輕”的時代。在HTML5中内置了兩種本地資料庫，一種為SQLLite，一種為indexedDB。
用executeSql來執行查詢
1.transaction.executeSql(sqlquery,[],dataHandler,errorHandler);
2.function dataHandler(transaction,results);
3.function errorHandler(transaction,errmsg);
4.rows.length擷取記錄的條數
建立SqlTest.html，代碼如下：
在HTML5中，新增了一種被稱為“indexedDB”的資料庫，該資料庫是一種存儲在用戶端本地的NoSQL資料庫。
建立IndexedDBTest.html，代碼如下：
隻是成功連結資料庫，我們還不能執行任何資料操作，我們還應該建立相當于關系型資料庫中資料表的對象倉庫與用于檢索資料的索引。
建立versionUpdate.html，代碼如下：
對于建立對象倉庫與索引的操作，我們隻能在版本更新事務内部進行，因為在indexedDB API中不允許資料庫中的對象倉庫在同一個版本中發生改變。
建立createStorge.html，代碼如下：
本文轉自鄒瓊俊部落格園部落格，原文連結：http://www.cnblogs.com/jiekzou/p/6938887.html，如需轉載請自行聯系原作者