前回、前々回とHTML5の新機能の話をしました。前回は、スマートフォンが圏外でもコンテンツが見えるキャッシュマニフェスト前々回は、HTML5の新要素のについてまとめました。今回は、WebStorageAPIについてまとめてみます。WebStorageはデータが保存できるようになります。サーバ通信が発生するという制限がありました。Cookieでは有効期限も設定出来ました。・サーバー通信なし・キー名と値のペアでデータ保存って感じです。Cookiが良いとかWebStorageが良いとかいうんじゃなくて用途によって新しい方法が増えたって感じです。WebStorageAPIは、データ保存が異なる2種類があります・LocalStorage・SessionStorageLocalStorageは、データの保存期間が無制限です。SessionStorageは、Webブラウザを閉じるまでデータが保存されています。value);keysのキー名で、valueが保存されます。localStorage.getItem("keys");で、keysに保存されたデータを取得することができます。関連する関数一覧を作ってみました。id="navigator-online">データを入力して保存を押すとlocalStorageに保存されます。/></form></body>ちなみに、こんな感じで書いても動くみたい...。localStorage['data1'];localStorageの注意点は、ドメインごとで管理されているのでホスティングされている共通ドメインのサービスとかでclear()を使うとドメイン内の全部のデータが消えてしまうので注意が必要です。ホスティングとかだとremoveItemsで明示的に消した方がいいです。サービスのオプション設定とかはDB使わなくても、localStorageで十分かもしれない。あと、前回の記事で書いたキャッシュマニフェストとlocalStorageの組み合わせでオフライン(圏外)の時にも表示出来るサイトも作成出来るしlocalStorageにXMLやJSONデータを先読みしておけばプリフェッチ機能として利用でき、サイトを高速に表示しているように出来るし便利な機能だと思います。今後は、WebStorageAPIも活用していこうと思います。uekusaバナナ味の食べ物が好きです♪このブログでは「ソーシャルメディア」「スマートフォン」「バナナ」を中心に書きます。