HTML5 提供了两种在客户端存储数据的新方法:

localStorage:

  (1)它的生命周期是永久的,关闭页面或浏览器之后localStorage中的数据也不会消失。

  (2)它的容量大小是5M作用,而cookie一般就4kb.

  (3)它不能设置过期时间,需要自己处理清除,而cookie可以设置过期时间。

  (4)它的保存方式是明文暴露的,而cookie是保存在密文的

  (5)常用方法:

         (1)设置缓存:localstorage.set("myname" , "legendheng");

         (2)获取缓存:localstorage.get("myname" );

         (3)清除某个缓存:localstorage.remove("myname" );

         (4)清除全部缓存:localstorage.clear();

在控制台调试器下的例子:

sessionStorage:

  (1)它的生命周期是在仅在当前会话下有效,即使刷新页面同样存在,但关闭浏览器后会数据清除。

  (2)它的使用方法和localstorage基本相同,只不过是把localstorage改成sessionstorage

  (5)常用方法:

         (1)设置缓存:sessionStorage.set("myname" , "legendheng");

         (2)获取缓存:sessionStorage.get("myname" );

         (3)清除某个缓存:sessionStorage.remove("myname" );

         (4)清除全部缓存:sessionStorage.clear();

在控制台调试器下的例子:

两者的兼容比较:

html5新特性localStorage和sessionStorage的更多相关文章

  1. hybrid app开发中用到的html5新特性localStorage、sessionStorage和websql database

    近期在项目中进行hybrid app开发,项目中有大量的js代码执行在android设备上. 使用到了非常多HTML5的新特性,之前没有遇到过,不了解.这里记录下添加点前端的知识.混合式app开发中. ...

  2. html5新特性

    这一篇博文不会告诉你怎么去使用html5的新特性,只会给你总结一下新特性------对于好学的人可以把这篇文章当做一个目录 对于初接触的人来说是一个导向 对于已经接触过的人来说是一个检测你掌握程度的检 ...

  3. web全栈架构师[笔记] — 03 html5新特性

    HTML5新特性 一.geolocation PC端 精度比较低 通过IP库定位 移动端 通过GPS window.navigator.geolocation 单次 getCurrentPositio ...

  4. 第二季第八天 HTML5新特性

    在函数内部window.a =  a  在全局中就可以拿到这个变量 变量命名.作为函数的参数的时候要详细.调用的时候可以简单点 做全局变量的两个方案 1.绑在标签上data 2.闭包 视频一般都是二进 ...

  5. 前端进阶系列(三):HTML5新特性

    HTML5 是对 HTML 标准的第五次修订.其主要的目标是将互联网语义化,以便更好地被人类和机器阅读,并同时提供更好地支持各种媒体的嵌入.HTML5 的语法是向后兼容的.现在国内普遍说的 H5 是包 ...

  6. HTML5新特性 websocket(重点)--多对多聊天室

    一.html5新特性  websocket(重点)--多对多聊天室 HTTP:超文本传输协议 HTTP作用:传输网页中资源(html;css;js;image;video;..) HTTP是浏览器搬运 ...

  7. 转: HTML5新特性之Mutation Observer

    转: HTML5新特性之Mutation Observer Mutation Observer是什么 Mutation Observer(变动观察器)是监视DOM变动的接口.当DOM对象树发生任何变动 ...

  8. HTML5新特性之CSS+HTML5实例

    1.新的DOCTYPE和字符集 HTML5的一项准则就是化繁为简,Web页面的DOCTYPE被极大的简化. <!DOCTYPE html> 同时字符集声明也被简化了: <meta c ...

  9. HTML5新特性:FileReader 和 FormData

    连接在这里: HTML5新特性:FileReader 和 FormData

随机推荐

  1. .NET完全手动搭建三层B/S架构

    简介:三层架构(3-tier application) 通常意义上的三层架构就是将整个业务应用划分为:表现层(WebUI).业务逻辑层(BusinessLogicLayer).数据访问层(DataAc ...

  2. 通讯协议(二)HTTPS协议

    摘要:本文尝试一步步还原HTTPS的设计过程,以理解为什么HTTPS最终会是这副模样.但是这并不代表HTTPS的真实设计过程.在阅读本文时,你可以尝试放下已有的对HTTPS的理解,这样更利于“还原”过 ...

  3. jfinal form表单提交文件

    前台代码 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8&q ...

  4. DataFrame查找

    一 通过索引取数据 (ix/loc/iloc) loc (根据索引名称取数据 , 适合多列) iloc (根据索引序号取数据,   适合多列) at  (和loc类似,只用于取单列, 性能更好) ia ...

  5. 学习VCL之路(1)

    在TObject类中,有一个Dispatch()方法和一个DefaultHandler()方法,它们都是与消息分发机制相关的. Dispatch()负责将特定的消息分发给合适的消息处理函数.首先它会在 ...

  6. windows 建立任务执行计划 自动执行脚本

    对于windows服务器网站如果要定时执行脚本,则需要在windows控制面板里找到 管理工具,点击任务计划程序,创建任务填写任务名称 触发器里新建触发条件,设置间隔时间 在操作项,新建触发时需要做的 ...

  7. Java中CSS&JS篇基础笔记

    HTML就是由一组标签所组成的.HTML的字体标签: <font>标签: 属性:color,size,face HTML的排版标签: h标签:标题标签. p标签:段落标签. b标签:加粗标 ...

  8. 怎么用Python写爬虫抓取网页数据

    机器学习首先面临的一个问题就是准备数据,数据的来源大概有这么几种:公司积累数据,购买,交换,政府机构及企业公开的数据,通过爬虫从网上抓取.本篇介绍怎么写一个爬虫从网上抓取公开的数据. 很多语言都可以写 ...

  9. 03_Docker入门(上)之容器创建、容器使用、容器删除

    运维架构服务docker:docker入门 一.确保docker就绪 查看docker程序是否存在,功能是否正常 Docker可执行程序的info命令,该命令会返回所有容器和镜像的数量.Docker使 ...

  10. linux下安装protobuf及cmake编译

    一.protobuf 安装 protobuf版本:2.6.1 下载地址:https://github.com/google/protobuf/archive/v2.6.1.zip 解压之后进入目录 修 ...