HTML5のLocalStorageでToDoリストを制作するチュートリアル
この記事は賞味期限切れです。(更新から1年が経過しています)
HTML5のlocalStorageを利用したToDoリストの作り方が
Nettus+のビデオチュートリアルで公開されています。
今流行りのHTML5ですよ、奥さん。
Quick Tip: Learning About HTML5 Local Storage | Nettuts+
ちなみに先程の記事の「JS Bin」はこのビデオで知りました。
英語ですが、ソースコードを見ているだけでよく分かります。
localStrage、恐ろしく簡単に使えるのですね。
夢が広がります。
格納/取得はsetItem/getItemで簡単に。
localStorage.setItem(‘keyName’, ‘Value you want to store.’); //格納
var hoge = localStorage.getItem(‘keyName’); //取得
プロパティアクセスでもOKです。
localStorage.keyName = ‘Value you want to store.’; //格納
var hoge = localStorage.keyName; //取得
/* または… */
localStorage['keyname'] = ‘Value you want to store.’;
var hoge = localStorage['keyName'];
ウィンドウを閉じてもデータは保持される様で、
つまりはASのSharedObjectみたいな使い方が出来る…のかな?
値はStringじゃないといけないみたいですが。
当セッションだけデータを保持されるsessionStorageなるものもあるそうな。
より詳しくはこちらへ。
【特集】詳解! HTML 5と関連APIの最新動向 – Webアプリ開発編 (7) Web Workers | エンタープライズ | マイコミジャーナル
大変便利なlocalStorageですが、
ローカルのデータを弄るわけで、妙な穴にならなければよいですね。
- 2010/08/25 :
- サンプルコードに加筆修正。
コメント