2010年09月28日

Web Storage

サーバー不要で保存できる「Web Storage」の使い方

Web Storageはブラウザ上に情報を保存しておく技術。結構いろいろなブラウザが対応している。

Internet Explorer 8以降
Safari 4以降
Firefox 3.5以降
Google Chrome 3以降
Opera 10.5以降

同じような技術でcookieがあるが容量が大きいとかんがえておけばよい。

Firefox3.5.3 5MB
Firefox3.6β5 4.99MB
iPhone 3.1.2 2.49MB
Safari4 50MB以上
Chrome 4 2.49MB
IE8 2.22MB
Opera10.50 2.49MB

Web Storage の残容量を調べてみた

if(window.localStorage){
alert("ok");
}


localStorageプロパティが利用できればlocalStorageが利用できる


var ls = window.localStorage;
if(!ls.getItem("key")){
ls.setItem("key", "内容");
alert("セット");
}else{
alert(ls.getItem("key"));
}


setItemでキーを指定してデータを保存し、getItemでデータの取得が出来る。

var ls = window.localStorage;
if(!ls.key2){
ls.key2 = "内容2";
alert("セット2");
}else{
alert(ls.key2);
}
if(!ls["key3"]){
ls["key3"] = "内容3";
alert("セット3");
}else{
alert(ls["key3"]);
}


プロパティや配列としても保存可能。


また、window.removeItem(key)でデータの削除が出来る。

参考:W3C - 『Web Storage』日本語訳
posted by ねこまんま at 11:36 | Comment(0) | TrackBack(0) | HTML5 | 更新情報をチェックする
この記事へのコメント
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント:

※ブログオーナーが承認したコメントのみ表示されます。

この記事へのトラックバック