js solution de stockage local : localStorage et userData

Avec le développement rapide des applications WEB, le stockage local de certaines données est devenu une exigence importante, et il existe de nombreuses solutions de mise en œuvre. La plus courante est les cookies, qui sont souvent utilisés par tout le monde, mais les défauts des cookies sont évidents. D'autres solutions incluent userData pour IE6 et versions ultérieures, globalStorage pour Firefox et le stockage local Flash. À l'exception de Flash, les autres ont des problèmes de compatibilité.

sessionStorage et localStorage

Le stockage Web se compose en fait de deux parties : sessionStorage et localStorage.

sessionStorage est utilisé pour stocker localement les données dans une session. Ces données ne sont accessibles que par les pages de la même session et les données seront détruites à la fin de la session. Par conséquent, sessionStorage n'est pas un stockage local persistant, mais uniquement un stockage au niveau de la session.

localStorage est utilisé pour le stockage local persistant, à moins que les données ne soient activement supprimées, les données n'expireront jamais.

userData

Syntaxe :

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")

Attributs :

• expires Définir ou obtenir la date d'expiration du comportement userData des données enregistrées.

• XMLDocument Obtient une référence à XML.

Méthode :

• getAttribute() Obtient la valeur d'attribut spécifiée.

• load(object) charge les données d'objet stockées à partir de la zone de stockage userData.

• removeAttribute() Supprime l'attribut spécifié de l'objet.

• save(object) Stocke les données d'objet dans une zone de stockage userData.

• setAttribute() définit la valeur de l'attribut spécifié.

localStorage

Méthode :

• localStorage.getItem(key) : récupère la valeur du stockage local du spécifié key

• localStorage.setItem(key, value) : Stocke la valeur dans le champ clé

• localStorage.removeItem(key) : Supprime le valeur stockée localement pour la clé spécifiée

Encapsulation

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)
            }
        }
    }
}

Ce qui précède est le contenu de la solution de stockage local js : localStorage et userData Pour plus de contenu connexe, veuillez. faites attention au site Web PHP chinois (www.php. cn) !