ブラウザ上でのデータのローカルストレージ・ノットの実現

クライアントがデータを格納する際、私たちは一般的にcookie(機密データではない)を使用しますが、クライアントがますます豊かになっている今日、cookieが格納できる量(ドメインごとに最大4 k)は本当に小さいです.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で開くと取得できません.