Webブラウザベースのローカルストレージ方法の応用
1319 ワード
クライアントがデータを格納する際、私たちは一般的にcookie(機密データではない)を使用しますが、クライアントがますます豊かになっている今日、cookieが格納できる量(ドメインごとに最大4 k)は本当に小さいです.
HTML 5ではlocalStorageが使用可能ですが、これはIE 8-を捨てました.互換性のために、私たちはIEがずっと前からやっていたストレージ方法をめくることができます.
エレメントに特殊なスタイルurl(#default#userData)を追加すると、setAttributeとgetAttributeでキー値ペア形式のデータにアクセスできます.
注意すべき点は、データが変更された後にsaveメソッドを使用し、データロードの初期にloadを使用することです.
次に使用方法を貼り付け、使用しているブラウザがHTML 5をサポートしている場合はlocalStorageを使用します.
しかし、互換性があっても問題があります.例えばIEに格納されている情報は、Chromeで開くと取得できません.
HTML 5ではlocalStorageが使用可能ですが、これはIE 8-を捨てました.互換性のために、私たちはIEがずっと前からやっていたストレージ方法をめくることができます.
エレメントに特殊なスタイルurl(#default#userData)を追加すると、setAttributeとgetAttributeでキー値ペア形式のデータにアクセスできます.
注意すべき点は、データが変更された後にsaveメソッドを使用し、データロードの初期にloadを使用することです.
次に使用方法を貼り付け、使用しているブラウザがHTML 5をサポートしている場合はlocalStorageを使用します.
var localStorage = (function(db) {
if (typeof db.clear == "function") {
return db;
}
var database = document.createElement("div")
database.id = "database";
database.style.behavior = "url(#default#userData)";
document.body.appendChild(database);
database.load("DataStore");
return {
setItem: function(key, val) {
database.setAttribute(key, val);
database.save("DataStore");
}
, getItem: function(key) {
return database.getAttribute(key);
}
, removeItem: function(key) {
database.removeAttribute(key);
database.save("DataStore");
}
};
} (localStorage || {}));
しかし、互換性があっても問題があります.例えばIEに格納されている情報は、Chromeで開くと取得できません.