一、本地存储分为cookie,以及新增的localStorage和sessionStorage

1、cookie存储在本地,容量最大4k,在同源的http请求时携带传递,损耗带宽,可设置访问路径,只有此路径及此路径的子路径才能访问此cookie,在设置的过期时间之前有效。

a、jquery设置cookie。expires过期时间

$.cookie("mycookie","ok",{expires:7,path:"/"});

b、jquery获取cookie

$.cookie("mycookie");

2、localStorage存储在本地,容量为5M或者更大,不会在请求时候携带传递,在所有同源窗口中共享,数据一直有效,除非人为删除,可作为长期数据。

设置:

localStorage.setItem("data","456");或者localStorage.data = "456";

获取:

localStorage.getItem("data");或者localStorage.data

删除:

localStorage.removeItem("data")

3、sessionStorage存储在本地,容量为5M或者更大,不会在请求时候携带传递,在同源的当前窗口关闭前有效,但刷新页面或使用“前进”、“后退按钮”后sessionStorage仍然存在。

localStorage和sessionStorage合称为WebStorage,WebStorage支持事件通知机制,可以将数据更新的通知监听者,WebStorage的api接口使用更方便

注:iPhone的无痕浏览不支持WebStorage,只能使用cookie

本地存储之cookie、localStorage、sessionStorage的更多相关文章

  1. 本地存储常用方式 localStorage, sessionStorage,cookie 的区别 和 服务器存储session

    本地存储:把一些信息存储到客户端本地(主要目的有很多,其中有一个就是实现多页面之间的信息共享)       1. 离线缓存(xxx.manifest)  H5处理离线缓存还是存在一些硬伤的,所以真实项 ...

  2. Cookie localStorage sessionStorage

    三者的异同 特性 Cookie localStorage sessionStorage 数据的生命期 可设置失效时间,默认是关闭浏览器后失效 除非被清除,否则永久保存 仅在当前会话下(tab标签页)有 ...

  3. 大家都能看得懂的源码 - 如何封装 cookie/localStorage/sessionStorage hook?

    本文是深入浅出 ahooks 源码系列文章的第九篇,该系列已整理成文档-地址.觉得还不错,给个 star 支持一下哈,Thanks. 今天来看看 ahooks 是怎么封装 cookie/localSt ...

  4. 本地存储(cookie&sessionStorage&localStorage)

    好文章,最全面.就查它吧:https://segmentfault.com/a/1190000004556040 1.DOM存储:https://developer.mozilla.org/zh-CN ...

  5. H5新特性 本地存储---cookie localStorage sessionStorage

    本地存储的作用 :避免登录网站时,用户在页面浏览时重复登录,也可以实现快速登录,一段时间内保存用户的登录效果,提高页面访问速率 在html5中提供三种数据持久化操作的方法: 1.cookie 可看作是 ...

  6. 计算机浏览器存储技术cookie、sessionStorage、localStorage

    HTTP无状态协议是指协议对于事务处理没有记忆能力.会话跟踪协议的状态是指下一次传输可以"记住"这次传输信息的能力,无状态是指同一个会话(注意什么叫同一个会话)的连续两个请求互相不 ...

  7. javascript的本地存储 cookies、localStorage

    一.cookies 本地存储 首先是常用的cookies方法,网上有很多相关的代码以及w3cSchool cookies. // 存储cookies function setCookie(name,v ...

  8. [JavaScript] Cookie,localStorage,sessionStorage概述

    Cookie Cookie 是一些数据, 存储于你电脑上的文本文件中,当 web 服务器向浏览器发送 web 页面时,在连接关闭后,服务端不会记录用户的信息.Cookie 的作用就是存储 web 页面 ...

  9. 地理位置(navigation.geolocation)与本地存储(seessionStorage、localStorage)

    一.地理位置( geolocation ): navigator.geolocation对象: 1.单次请求: //navigator.geolocation.getCurrentPosition( ...

随机推荐

  1. 每天一个Linux命令—— WC

    一.首先看一下帮助 Usage: wc [OPTION]... [FILE]...  or:  wc [OPTION]... --files0-from=F Print newline, word, ...

  2. Java中常见的数据结构的区别

    把多个数据按照一定的存储方式,存储起来,称存储方式之为数据结构. 数据的存储方式有很多,数组,队列,链表,栈,哈希表等等. 不同的数据结构,性能是不一样的,比如有的插入比较快,查询比较快,但是删除比较 ...

  3. dedecms列表页调用子栏目列表,织梦首页调用栏目的子栏目标签代码

    dedecms列表页调用子栏目列表,织梦首页调用栏目的子栏目标签代码. dedecms列表页调用子栏目列表标签: {dede:channelartlist type='sun' }<a href ...

  4. python爬虫之re正则表达式库

    python爬虫之re正则表达式库 正则表达式是用来简洁表达一组字符串的表达式. 编译:将符合正则表达式语法的字符串转换成正则表达式特征 操作符 说明 实例 . 表示任何单个字符 [ ] 字符集,对单 ...

  5. JS学习笔记——JavaScript继承的6种方法(原型链、借用构造函数、组合、原型式、寄生式、寄生组合式)

    JavaScript继承的6种方法 1,原型链继承 2,借用构造函数继承 3,组合继承(原型+借用构造) 4,原型式继承 5,寄生式继承 6,寄生组合式继承 1.原型链继承. <script t ...

  6. CoolBlog开发笔记第1课:项目分析

    首先说一下CoolBlog开发笔记是我制作的<Django实战项目>系列教程基础篇的内容,使用Django来开发一个酷炫的个人博客,涉及的知识包括项目的分析,环境的搭建,模型和视图定义等等 ...

  7. windows安装nvm管理node版本

    1.卸载原本系统里面的nodejs 2.下载nvm安装包:https://github.com/coreybutler/nvm-windows/releases ---->nvm-setup.z ...

  8. maven打包 tomcat运行pom配置 或 打成jar包

    maven打包 tomcat运行pom配置,同时还需要配置org.apache.tomcat.maven插件,这里省略. <groupId>com.company</groupId& ...

  9. PHP Startup: Unable to load dynamic library '/usr/lib64/php/modules/event.so'

    这是因为启动apche 的时候重复加载了php的动态库模块了, 将:/etc/php.d/ 目录下的event.ini中的内容注释掉或者将文件删除即可

  10. JS之正则表达式

    一.正则表达的目标: 1.使用表单事件和脚本函数实现表单验证 2.使用String对象和文本框控件常用属性和方法实现客户端验证 二.什么需要表单验证: 1.表单元素是否为空 2.用户名和密码 3.E- ...