js lokale Speicherlösung – localStorage und userData

Mit der rasanten Entwicklung von WEB-Anwendungen ist die lokale Speicherung einiger Daten zu einer wichtigen Anforderung geworden, und es gibt viele Implementierungslösungen. Die häufigste davon sind Cookies, die häufig von allen verwendet werden, aber die Mängel von Cookies liegen auf der Hand Zu den anderen Lösungen gehören userData für IE6 und höher, globalStorage für Firefox und Flash-Lokalspeicher. Mit Ausnahme von Flash weisen die anderen einige Kompatibilitätsprobleme auf.

sessionStorage und localStorage

Web Storage besteht eigentlich aus zwei Teilen: sessionStorage und localStorage.

sessionStorage wird zum lokalen Speichern von Daten in einer Sitzung verwendet. Auf diese Daten kann nur von Seiten in derselben Sitzung zugegriffen werden und die Daten werden zerstört, wenn die Sitzung endet. Daher handelt es sich bei sessionStorage nicht um einen dauerhaften lokalen Speicher, sondern nur um einen Speicher auf Sitzungsebene.

localStorage wird für die dauerhafte lokale Speicherung verwendet, sofern die Daten nicht aktiv gelöscht werden.

userData

Syntax:

XML  <Prefix: CustomTag ID=sID STYLE="behavior:url(&#39;#default#userData&#39;)" />

HTML  <ELEMENT STYLE="behavior:url(&#39;#default#userData&#39;)" ID=sID>

Scripting    object .style.behavior = "url(&#39;#default#userData&#39;)"

object.addBehavior ("#default#userData")

Attribute:

• expires Legen Sie das Ablaufdatum für das Benutzerdatenverhalten der gespeicherten Daten fest oder rufen Sie es ab.

• XMLDocument Ruft einen Verweis auf XML ab.

Methode:

• getAttribute() Ruft den angegebenen Attributwert ab.

• load(object) lädt die gespeicherten Objektdaten aus dem userData-Speicherbereich.

• removeAttribute() Entfernt das angegebene Attribut des Objekts.

• save(object) Speichert Objektdaten in einem userData-Speicherbereich.

• setAttribute() setzt den angegebenen Attributwert.

localStorage

Methode:

• localStorage.getItem(key): Ruft den Wert des lokalen Speichers des angegebenen ab key

• localStorage.setItem(key, value): Speichern Sie den Wert im Schlüsselfeld

• localStorage.removeItem(key): Löschen Sie den Wert, der lokal für den angegebenen Schlüssel gespeichert wird

Kapselung

localData = {
    hname:location.hostname?location.hostname:'localStatus',
    isLocalStorage:window.localStorage?true:false,
    dataDom:null,

    initDom:function(){ //初始化userData
        if(!this.dataDom){
            try{
                this.dataDom = document.createElement('input');//这里使用hidden的input元素
                this.dataDom.type = 'hidden';
                this.dataDom.style.display = "none";
                this.dataDom.addBehavior('#default#userData');//这是userData的语法
                document.body.appendChild(this.dataDom);
                var exDate = new Date();
                exDate = exDate.getDate()+30;
                this.dataDom.expires = exDate.toUTCString();//设定过期时间
            }catch(ex){
                return false;
            }
        }
        return true;
    },
    set:function(key,value){
        if(this.isLocalStorage){
            window.localStorage.setItem(key,value);
        }else{
            if(this.initDom()){
                this.dataDom.load(this.hname);
                this.dataDom.setAttribute(key,value);
                this.dataDom.save(this.hname)
            }
        }
    },
    get:function(key){
        if(this.isLocalStorage){
            return window.localStorage.getItem(key);
        }else{
            if(this.initDom()){
                this.dataDom.load(this.hname);
                return this.dataDom.getAttribute(key);
            }
        }
    },
    remove:function(key){
        if(this.isLocalStorage){
            localStorage.removeItem(key);
        }else{
            if(this.initDom()){
                this.dataDom.load(this.hname);
                this.dataDom.removeAttribute(key);
                this.dataDom.save(this.hname)
            }
        }
    }
}

Das Obige ist der Inhalt der lokalen Speicherlösung von js – localStorage und userData. Weitere verwandte Inhalte finden Sie hier Achten Sie auf die chinesische PHP-Website (www.php.cn)!