您的位置:首页 > 其它

请描述一下 cookies,sessionStorage 和 localStorage 的区别?

2014-12-20 23:02 537 查看
http://handyxuefeng.blog.163.com/blog/static/454521722013111714040259/
http://book.51cto.com/art/201106/270499.htm http://www.cnblogs.com/blackbird/archive/2012/06/18/2553718.html
软件编程希望通过一些手段来持久化的存储一些有用的数据。对于网络化编程,一般将这项任务交给了服务器端的数据库或者浏览器端的cookie。随着HTML5的出现,web开发又有了两种选择:Web Storage和Web SQL Database.

Web Storage有两种形式:LocalStorage(本地存储)和sessionStorage(会话存储)。这两种方式都允许开发者使用js设置的键值对进行操作,在在重新加载不同的页面的时候读出它们。这一点与cookie类似。

1.与cookie不同的是:Web Storage数据完全存储在客户端,不需要通过浏览器的请求将数据传给服务器,因此x相比cookie来说能够存储更多的数据,大概5M左右。

2.LocalStorage和sessionStorage功能上是一样的,但是存储持久时间不一样。

    LocalStorage:浏览器关闭了数据仍然可以保存下来,并可用于所有同源(相同的域名、协议和端口)窗口(或标签页),

    sessionStorage:数据存储在窗口对象中,窗口关闭后对应的窗口对象消失,存储的数据也会丢失。

注意:sessionStorage 都可以用localStorage 来代替,但需要记住的是,在窗口或者标签页关闭时,使用sessionStorage 存储的数据会丢失。

3、使用 local storage和session storage主要通过在js中操作这两个对象来实现,分别为window.localStorage和window.sessionStorage. 这两个对象均是Storage类的两个实例,自然也具有Storage类的属性和方法。

Storage类的相关成员如下:
成员名方法参数描述
length属性获取存储数据的条数
key(n)    
n:索引值根据索引值,返回键名
getItem(key)key:键名根据键名,获取数据值
setItem(key,value)key:键名 value:键值根据键名和键值设置数据项,如果键名已经存在,则覆盖值
removeItem(key)key:键名根据键名删除一个数据项
clear()清空当前的Storage对象
其用法:

参数设置很简单,如下例:

localStorage.setItem('age', 40); 

访问一个存储的数据一样很容易:

var age = localStorage.getItem('age'); 

可以这样删除一个特定的键值对:

localStorage.removeItem('age'); 

或者删除所有的键值对:

localStorage.clear(); 

当然以上的都可以用sessionStorage代替,但是窗口关闭后数据丢失。

sessionStorage与页面
js 数据对象的区别:

页面中的一般js数据对象的作用范围为当前页面,当页面重新加载或者转到另一个页面,数据就不存在了;而sessionStorage只要是同源的同
a507
窗口(Tab)中,刷新页面或者进入不同的页面数据对象仍然被保存,也就是说只要浏览器窗口不关闭,加载页面(同源)或刷新页面,数据仍存在。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: