LocalStorage

  • 是对Cookie的优化
  • 没有时间限制的数据存储
  • 在隐私模式下不可读取
  • 大小限制在500万字符左右,各个浏览器不一致
  • 在所有同源窗口中都是共享的
  • 本质是在读写文件,数据多的话会比较卡(firefox会一次性将数据导入内存)
  • 不能被爬虫爬取,不要用它完全取代URL传参
  • IE7及以下不支持外,其他标准浏览器都完全支持

SessionStorage

  • 针对一个 session 的数据存储
  • 大小限制在5M左右,各个浏览器不一致
  • 仅在当前浏览器窗口关闭前有效(适合会话验证)
  • 不在不同的浏览器窗口中共享,即使是同一个页面

SessionStorage:

存储数据:

sessionStorage.setItem('testKey','这是一个测试的value值'); // 存入一个值

sessionStorage['testKey'] = '这是一个测试的value值'

读取数据:

sessionStorage.getItem('testKey'); // => 返回testKey对应的值

sessionStorage['testKey']; // => 这是一个测试的value值

存储JSON:

var userEntity = {
name: 'tom',
age: 22
}; // 存储值:将对象转换为Json字符串
sessionStorage.setItem('user', JSON.stringify(userEntity)); // 取值时:把获取到的Json字符串转换回对象
var userJsonStr = sessionStorage.getItem('user');
userEntity = JSON.parse(userJsonStr);
console.log(userEntity.name); // => tom

localhostStorage:

JS下的操作方法

  • 获取键值:localStorage.getItem(“key”)
  • 设置键值:localStorage.setItem(“key”,”value”)
  • 清除键值:localStorage.removeItem(“key”)
  • 清除所有键值:localStorage.clear()
  • 获取键值2:localStorage.keyName
  • 设置键值2:localStorage.keyName = “value”

JQ下的操作方法(JS方法前加”window.”)

  • 获取键值:window.localStorage.getItem(“key”)
  • 设置键值:window.localStorage.setItem(“key”,”value”)
  • 清除键值:window.localStorage.removeItem(“key”)
  • 清除所有键值:window.localStorage.clear()
  • 获取键值2:window.localStorage.keyName
  • 设置键值2:window.localStorage.keyName = “value”

JQuery和JS操作LocalStorage/SessionStorage的方法的更多相关文章

  1. JQuery和JS操作LocalStorage/SessionStorage的方法(转)

    出处:http://blog.csdn.net/djzhao627/article/details/50747628 首先说一下LocalStorage和SessionStorage LocalSto ...

  2. Jquery.cookie.js 源码和使用方法

    jquery.cookie.js源码和使用方法 jQuery操作cookie的插件,大概的使用方法如下 $.cookie(‘the_cookie’); //读取Cookie值$.cookie(’the ...

  3. jquery.cookie.js 操作cookie实现记住密码功能的实现代码

    jquery.cookie.js操作cookie实现记住密码功能,很简单很强大,喜欢的朋友可以参考下.   复制代码代码如下: //初始化页面时验证是否记住了密码 $(document).ready( ...

  4. JS操作字符串常用的方法

    JS操作String对象的方法 charAt(index):返回指定索引处的字符串charCodeAt(index):返回指定索引处的字符的Unicode的值concat(str1,str2,...) ...

  5. JS操作数组常用的方法

    JS操作Array对象的方法 concat(arr1,arr2,...):连接数组indexOf(value):返回数组中value的第一个索引join(separator):将数组中所有的元素连接由 ...

  6. js操作html的基本方法

    刚学了js操作html的基本方法,在写代码过程中,有很多格式不规范,忘记加双引号尤其重要,通常这 样的错误很容易范,并且这种错误很难找.随着代码学习量越来越多,很多写法容易搞混.今天记录一下,以便后期 ...

  7. 前端 JS,localStorage/sessionStorage、cookie 及 url 等实现前台数据共享、传输

    需求是这样的:需要统计用户公司某款产品用户的回馈情况,美工给的设计多个psd,每个页面里面都有一个选择题,让用户选择自己的答案,最后经过几次选择之后在最后一个页面统一提交到后台!所以这里引出的技术需求 ...

  8. jQuery.cookie.js插件了解及使用方法

    jquery.cookie.js插件实现浏览器的cookie存储,该插件是基于jquery开发,方便cookie使用. jquerycookie.js的下载地址 http://plugins.jque ...

  9. 使用Jquery.cookie.js操作cookie

    query.cookie.js是一个基于jquery的插件,点击下载! 创建一个会话cookie: $.cookie(‘cookieName’,'cookieValue’); 注:当没有指明cooki ...

随机推荐

  1. 浏览器拦截js打开新窗口

    最近做项目时,遇到的问题"想通过javascript在浏览器新标签页或新窗口打开一个新的页面,结果被浏览器大大无情给拦截了"业务需求:前端提交数据到后端,后端返回url,然后在新窗 ...

  2. tomcat警告setting property 'debug' to '0' did not find a matching property

    在使用tomcat6.0版本结合myeclipse进行java web项目,运行程序显示setting property 'debug' to '0' did not find a matching ...

  3. 了解web及网络基础

    了解web及网络基础 以下内容简单的说明了一下TCP/IP协议族中HTTP协议.DNS服务.IP协议的一些概念和关系.笔者只是对知识点进行了总结,仅供参考: ) 转载请注明出处:了解web及网络基础 ...

  4. 【NOI2015】程序自动分析

    https://www.luogu.org/problem/show?pid=1955 并查集+离散化. 先执行所有x=y问题,即合并x和y. 再依次执行所有x!=y问题,即查询x和y是否处于同一集合 ...

  5. Struts框架的国际化

    本文将通过一个详细的实例来展示Struts框架的国际化,使用的版本号是struts1.1. 案例:在一个页面上有一个下拉框,下拉框中有3个国家的语言选项,各自是"中文简体".&qu ...

  6. Druid数据库连接池源码分析

    上一篇文章重点介绍了一下Java的Future模式,最后意淫了一个数据库连接池的场景.本想通过Future模式来防止,当多个线程同时获取数据库连接时各自都生成一个,造成资源浪费.但是忽略了一个根本的功 ...

  7. MyBatis_延迟加载01

    一.延迟加载 MyBatis中的延迟加载,也称为懒加载,是指在进行关联查询时, 按照设置延迟规则推迟对关联对象的select查询.延迟加载可以有效的减少数据库压力. MyBatis的延迟加载只是对关联 ...

  8. redis的sort命令

    1.简单描述 sort命令可以对list.set和sorted set的元素进行排序,然后显示排序的结果,不影响这些类型里面存储的数据的排序.就是说sort可以对list的元素排序,但是执行lrang ...

  9. spring-boot学习笔记之Conditional

    今天看了@Conditional,自己根据以下文章练了下,根据自己的理解操作的             转载出处:http://wiselyman.iteye.com/blog/2213054 17. ...

  10. Pycharm配置(一)

    Pycharm作为一款强力的Python IDE,在使用过程中感觉一直找不到全面完整的参考手册,因此决定对官网的Pycharm教程进行简要翻译,与大家分享. 1.准备工作 官网下载 2.如何选择Pyc ...