ストレージの使い方


Storage

 ローカルストレージは、クライアント側のディスクにデータを保存できる機能です。ストレージには window.localStorage とcode.sessionStorage があります。前者は、期限なしに使えるもので、後者はそのセッションの間だけ有効なストレージです。

window.localStorage

 localStorage.setItem(name, data)でローカルストレージにデータを保存できます。localStorage.getItem(name)メソッドでデータを読み出します。

  var s = "";
  var key;
  if (localStorage.length == 0) {
    localStorage.setItem("k1", "value1");
     $("#result1").text("localStorageに{k1,\"value1\"}を保存しました。");
  }
  else {
    var n = localStorage.length;
    if (n > 5)
      n = 5;
    for (var i = 0; i < localStorage.n; i++) {
      s += " ("
      s += i;
      s += ") ";
      key =localStorage.key(i);
      s += key;
      s += ":";
      s += localStorage.getItem(key);
      s += "<br />";
    }
    $("#result1").text(s);


code.sessionStorage

 セッションストレージは、ブラウザが閉じるまで有効であることを除き、ローカルストレージと同じです。

var s = "";
var key;
if (sessionStorage.length == 0) {
sessionStorage.setItem("k1s", "value1s");
 $("#result2").text("sessionStorageに{k1s,\"value1s\"}を保存しました。");
}
else {
for (var i = 0; i < sessionStorage.length; i++) {
  s += " ("
  s += i;
  s += ") ";
  key =sessionStorage.key(i);
  s += key;
  s += ":";
  s += sessionStorage.getItem(key);
}
$("#result2").text(s);
}


ストレージのメソッドとプロパティ

項目説明
length保存されているデータの数
key(n)保存されているn番目のキー
getItem(key)keyに対する値を得る。
setItem(key, value)keyに対する値 value を設定する。
removeItem(key)keyに対する項目を削除する。
clear() データをすべて削除する。

 

このページの先頭へ戻る