使用sessionStorage、localStorage存储数组与对象(转)
http://my.oschina.net/crazymus/blog/371757
使用sessionStorage、localStorage存储数组与对象
有时候,我们需要将数据存储到sessionStorage和localStorage中,这样做的好处有:
1 缓存数据
2 减少对内存的占用
但是,storage只能存储字符串的数据,对于JS中常用的数组或对象却不能直接存储。
|
1
2
3
4
5
6
7
|
var obj = { name:'Jim' };sessionStorage.obj = obj; localStorage.obj = obj; var arr = [1,2,3]; sessionStorage.obj = arr; localStorage.obj = arr; |
上面的写法都是不能成功的!但我们可以通过JSON对象提供的parse和stringify将其他数据类型转化成字符串,再存储到storage中就可以了。请看下面的代码。
|
1
2
3
4
5
6
7
8
9
|
var obj = { name:'Jim' }; var str = JSON.stringify(obj); //存入 sessionStorage.obj = str; //读取 str = sessionStorage.obj; //重新转换为对象 obj = JSON.parse(str); |
localStorage也一样,只是和sessionStorage的存储时间不一样。
需要注意的是,JS中的数组本质上也是对象类型,所以上面的代码对数组也是适用的。
使用sessionStorage、localStorage存储数组与对象(转)的更多相关文章
- localStorage存储数组,对象,localStorage,sessionStorage存储数组对象
localStorage存储数组,对象,localStorage,sessionStorage存储数组对象 前言 最近在用angular做商城购物车的功能模块,因为angular的watch监听, ...
- 使用sessionStorage、localStorage存储数组与对象
先介绍一下localStorage localStorage对象是HTML5的客户端存储持久化数据的方案.为了能访问到同一个localStorage对象,页面必须来自同一个域名(子域名无效),使用同一 ...
- sessionStorage、localStorage 存储及如何存储数组与对象
1.存储,获取,清楚 sessionStorage.setItem("key",val) sessionStorage.getItem("key") sessi ...
- localStorage存储数组以及取数组方法
var weekArray = ['周一'.'周二'.'周三'.'周四'.'周五']; //存: localStorage.setItem('weekDay',JSON.stringify(weekA ...
- localStorage 存储 数组
let str = JSON.stringify(data.list); localStorage.setItem("options",str); let optionss=loc ...
- localStorage存储对象,sessionStorage存储数组对象
前言 最近在用angular做商城购物车的功能模块,因为angular的watch监听,数据只要发生变化就能很方便的自动渲染页面.但随即出现的问题是,之前用户操作的样式都会被重置掉. 例如我勾选了几个 ...
- localStorage存储JSON对象的小方法
有时候,我们需要将数据存储到sessionStorage和localStorage中,这样做的好处有: 1 缓存数据 2 减少对内存的占用 但是,storage只能存储字符串的数据,对于JS中常用的数 ...
- sessionStorage和localStorage存储的转换不了json
先说说localStorage与sessionStorage的差别 sessionStorage是存储浏览器的暂时性的数据,当关闭浏览器下次再打开的时候就不能拿到之前存储的缓存了 localStora ...
- localstorage 和 sessionstorage 本地存储
在我们日常的工作和实际项目中,做好数据数据缓存可以是我们的程序执行效率更高,可以使我们避免重复请求 服务器,减轻服务器的压力,可以提高使用户的体验度. 那么 HTML5 存储的目标是什么? 1.解决存 ...
随机推荐
- CE5 WiFi开关
WinCE的WiFi开关要依赖于WiFi模块的休眠功能还有模块厂商提供的驱动里面有支持电源管理功能.这里面用的是SDIO86861模块,WinCE5的系统,S3C2416的CPU. 头文件要包括:#i ...
- 什么是JavaEE
Java技术不仅是一门编程语言而且是一个平台.同时Java语言是一门有着特定语法和风格的高级的面向对象的语言,Java平台是Java语言编写的特定应用程序运行的环境.Java平台有很多种,很多的Jav ...
- 如何书写高质量的jQuery代码(转)
想必大家对于jQuery这个最流行的javascript类库都不陌 生,而且只要是前端开发人员肯定或多或少的使用或者接触过,在今天的这篇文章中,参考了一些资料及实际使用效率,将介绍一些书写高质量jQu ...
- 解决wamp的Apache服务器不能重启
由于工作需要,现在开始研究PHP语言.刚开始搭建服务器环境就困难重重啊.首先看了下配置说明,很复杂很复杂(超级想念Visual Studio).然后问了下群里的老鸟,他们都是安装WAMPServer环 ...
- 学习laravel之路由问题 404
今天配置路由的时候,只有原来的自带路由可用: Route::get('/', function(){ return View::make('hello');}); 再网上搜索了办法:来自:htt ...
- jquery 如何遍历json
var obj = {"status":1,"bkmsg":"\u6210\u529f","bkdata":[" ...
- 安全沙箱冲突:Loader.content:XX 不能访问 XX 可以通过调用 Security.allowDomain 来避免此冲突。
参考资料:http://tieba.baidu.com/p/882855105 感谢:Z0287yyy 感谢分享精神. 具体解决方案:在loader去load的时候,带上这个参数 var contex ...
- hpp头文件与h头文件的区别
hpp,其实质就是将.cpp的实现代码混入.h头文件当中,定义与实现都包含在同一文件,则该类的调用者只需要include该hpp文件即可,无需再将cpp加入到project中进行编译.而实现代码将直接 ...
- web.xml 文件配置01
web.xml 文件配置01 前言:一般的web工程中都会用到web.xml,方便开发web工程.web.xml主要用来配置Filter.Listener.Servlet等.但是要说明的是web. ...
- poj 1003 (nyoj 156) Hangover
点击打开链接 题目大意 就是有很多卡片可以沿着桌边向外放,每次可以伸出1/2,1/3,1/4问最少多少卡片才能让一张完成的卡片悬空,题目输入卡片的宽度,输出卡片个数 #include<stdio ...