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

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

= .getItem('age');

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

localStorage.removeItem('age');

或者删除所有的键值对:

localStorage.clear();

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

sessionStorage只要是同源的同窗口(Tab)中,刷新页面或者进入不同的页面数据对象仍然被保存,也就是说只要浏览器窗口不关闭,加载页面(同源)或刷新页面,数据仍存在。

请描述一下 cookies,sessionStorage 和 localStorage 的区别?的更多相关文章

  1. 关于cookies,sessionStorage和localStorage的区别

    如果我说得啰嗦了,请麻烦提醒我一下~~ 面试的时候说: 首先这三个可以在浏览器端按下F12,在Application可以查看到. 如下图: cookies: sessionStorage: sessi ...

  2. 前端面试01:描述一下cookices sessionStorage 和 localStorage 的区别

    相同点:都可以存储在客户端 不同点: 1.存储大小 cookie数据大小不能超过4K. sessionStorage 和 localStorage 虽然也有大小限制,但是比cookie大得多,可以达到 ...

  3. cookies,sessionStorage和localStorage的区别

    联系: sessionStorage和localStorage一样,都是用来缓存客户端缓存信息. 他们都只能存储字符串类型对象. 区别: localStorage的生命周期是永久的,除非用户主动清除浏 ...

  4. 7,请描述下cookies,sessionStorage和localStorage的区别

    7,请描述下cookies,sessionStorage和localStorage的区别 首先,cookie是网站为了标识用户身份而储存在用户本地终端(client side,百科: 本地终端指与计算 ...

  5. cookies,sessionStorage 和 localStorage 的区别

    请描述一下 cookies,sessionStorage 和 localStorage 的区别? sessionStorage 和 localStorage 是HTML5 Web Storage AP ...

  6. cookies、sessionStorage和localStorage的区别

    cookies.sessionStorage和localStorage的区别 对比 特性 Cookie LocalStorage SessionStorage 数据的生命周期              ...

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

    cookie在浏览器和服务器间来回传递. sessionStorage和localStorage不会sessionStorage和localStorage的存储空间更大:sessionStorage和 ...

  8. 请描述一下cookies、sessionStorage、localStorage、session四者的区别?

    存储大小: cookie在4K以内. sessionStorage和localStorage在5M以内. 有效时间: cookie:如果未设置过期时间,关闭浏览器时清空:如果设置了有效时间则在到期后清 ...

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

    原文:http://blog.csdn.net/lxcao/article/details/52809939 相同点:都存储在客户端不同点: 1.存储大小 cookie数据大小不能超过4k. sess ...

  10. 描述一下 cookies,sessionStorage 和 localStorage 的区别

    cookie是网站为了标示用户身份而储存在用户本地终端(Client Side)上的数据(通常经过加密),数据会在浏览器和服务器间来回传递.sessionStorage和localStorage不会自 ...

随机推荐

  1. jquery mobile (一)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. web测试方面的知识

    web测试 软件测试体系架构设计 一.体系架构 1.C/S:客户端+服务器端,如QQ.单机版记事本.office等,所用语言:VB.C++.C.C#.JAVA.PB.D…等数组语言,C和S都是自己测, ...

  3. Oracle错误

    System.Data.OracleClient 需要 Oracle 客户端软件 8.1.7 或更高版本 这个是我页面报的错误,请帮解答 在错误出现的时候我第一时间现在了一个oracle客户端软件,然 ...

  4. Java中Map遍历的四种方案

    在Java中如何遍历Map对象 方式一 这是最常见的并且在大多数情况下也是最可取的遍历方式.在键值都需要时使用. Map<Integer, Integer> map = new HashM ...

  5. JavaScript高级程序设计54.pdf

    过滤输入 对于一些浏览器,可以使用正则表达式里的text()测试用户按下的按键,Firefox和safari(3.1版本之前)会对向上向下.退格键和删除键触发keypress事件,在Firefox中, ...

  6. Branch management

    Branch management */--> pre { background-color: #2f4f4f;line-height: 1.6; FONT: 10.5pt Consola,&q ...

  7. eclipse安装Hadoop1.1.2版本开发插件

    Hadoop1.1.2版本没有直接适合Eclipse的安装插件,需要手动打包jar文件. 我的系统配置: VMware Workstation10 CentOS-6.5-i386 hadoop-1.1 ...

  8. 初识chromium thread的实现

    接触chromium已有一段时间,写点东西学习一下吧. 首先说一下用法,如何利用chromium封装好的thread类来开一个线程.在base里有一个封装该类的头文件thread.h,include它 ...

  9. windows ntp安装及调试

    Setting up NTP on Windows It's very helpful that Meinberg have provided an installer for the highly- ...

  10. ASP.NET MVC- VIEW Creating Custom HTML Helpers Part 2

    The goal of this tutorial is to demonstrate how you can create custom HTML Helpers     that you can ...