株式会社あゆたのホームページに
HTML5のサンプル集がありましたので、今回はこのサンプルのコードと
マイコミジャーナルのHTML5 API記事を参考に勉強してみました。
今回は、Jqueryを用いるので、導入されてない方は、JavaScriptの記事を参考に、導入してください。
JavaScript の基礎、 Jqueryとは、Jqueryの基礎 その1 JavaScript の基礎、 Jqueryとは、Jqueryの基礎 その2 JavaScript の基礎、 Jqueryとは、Jqueryの基礎 その3 HTML5 API Web Storageとは･･･簡単にいうとクライアントサイドにデータを残す仕組み
つまり、インターネットに繋がっていない状況でも、クライアントサイドでデータの保存等ができるようになります。
HTML5 API Web Storageは、session storageとlocal storageの2種類あります。
sessionStorage … ウィンドウ(セッション)が閉じられると、データが無くなるストレージ
localStorage … プロトコル + ドメイン + ポートごとに異なるストレージとなる。複数のウィンドウをまたいでストレージは共通で、ウィンドウが閉じられてもデータは無くならないストレージ
今回のサンプルは、参考記事と基本的に同じですが、JavaScriptのコードをJqueryで書き換えてみました。
