js本地存储怎么实现

JavaScript014

js本地存储怎么实现,第1张

userData

语法:

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

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

Scripting object .style.behavior = "url('#default#userData')"

object .addBehavior ("#default#userData")

属性:

expires 设置或者获取 userData behavior 保存数据的失效日期。

XMLDocument 获取 XML 的引用。

方法:

getAttribute() 获取指定的属性值。

load(object) 从 userData 存储区载入存储的对象数据。

removeAttribute() 移除对象的指定属性。

save(object) 将对象数据存储到一个 userData 存储区。

setAttribute() 设置指定的属性值。

localStorage

方法:

localStorage.getItem(key):获取指定key本地存储的值

localStorage.setItem(key,value):将value存储到key字段

localStorage.removeItem(key):删除指定key本地存储的值

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)

                }

            }

        }

    }

代码如下:

这细微的差别就会影响到程序的结果。

代码如下:

这些颜色不仅作用于那些直接包含在<body>标签里的内容,还将作用于嵌套在body元素内的所有元素。

id属性就像一个挂钩,它一头连着文档里的某个元素,另一头连着CSS样式表里的某个样式。

document.getElementById("purchases")这个调用将返回一个对象,这个对象对应着document对象里的一个独一无二的元素,那个元素的的id属性值为purchases。其实,文档中的每个元素都是一个对象。利用DOM提供的方法能够得到任何一个对象。getElementsByTagName返回一个数组,即使整个文档里只有一个元素,也返回一个数组。

示例:

显示信息都是object,getElementByClassName也返回一个具有相同类名的元素数组,获取和设置属性getAttribute object.getAttribute(attribute)。

注:getAttribute方法不属于document对象,它只能通过元素节点对象调用。

例子:

用JS获取Html标签属性有两种方法:

如<a id="link" href="www.baidu.com" title="测试"

blogname="前端开发">Web开发</a>

JS代码:

var ka=document.getElementByI d("link")

alert(ka.getAttribute("id"))

alert(ka.id)

两种方法都能弹出a标签的ID属性,但从各浏览器兼容上来说用ka.id的方式更好,但对于自定义属性blogname,则就要用getAttribute()来实现了,如:

alert(ka.getAttribute("blogname"))//前端开发

总结如下:

JS获到Html标签常规属性用ka.id,获到Html标签的自定义属性就用ka.getAttribute("id")