在localStorage中存储对象数组并读取的方法


Posted in Javascript onSeptember 24, 2016

频繁ajax请求导致页面响应变慢。于是考虑将数据存储在window.storage中,这样只请求一次ajax,而不需要频繁请求。

鉴于localstorage中只能存储字符串,所以我们要借助于JSON.stringify()和JSON.parse();

$.ajax({
type: "get",
async: "true",
url: "",
data: {},
dataType: "jsonp",
success: function(data){
if(data instanceof Array){
stroage.push(JSON.stringify(data[i])); //storage是外部定义的数组 storage = []
}
},
error: function(){
}
});

现在,我们将data存储在了storage中,当我们需要使用时:

fucntion getData(){
window.localStorage.job = JSON.stringify(storage); //将storage转变为字符串存储
var job = JSON.parse(window.localStorage.job);
for(var i = 0; i < job.length; i++){
job[i] = JSON.parse(job[i]);
}
//此时job中存储的就是对象数组了
}

本地存储外,除了localStorage,还有sessionStorage.

(1)localStorage和sessionStorage都是用来存储客户端临时信息的对象。

(2)localStorage和sessionStorage都只能存储字符串类型的对象

(3)localStorage生命周期是永久,除非用户手动清除localStorage信息,否则这些信息将永远存在。

(4)sessionStorage生命周期为当前窗口或标签页,一旦窗口或标签页被永久关闭了,那么通过sessionStorage中存储的数据也就被清空了。

(5)不同浏览器无法共享localStorage或sessionStorage中的信息。相同浏览器的不同页面间可以共享相同的localStorage(页面属于相同域名和端口),但是不同页面或标签页间无法共享sessionStorage的信息。

以上所述是小编给大家介绍的在localStorage中存储对象数组并读取的方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
js一组验证函数
Dec 20 Javascript
js constructor的实际作用分析
Nov 15 Javascript
Javascript 鼠标移动上去小三角形滑块缓慢跟随效果
Apr 26 Javascript
Egret引擎开发指南之发布项目
Sep 03 Javascript
JavaScript实现事件的中断传播和行为阻止方法示例
Jan 20 Javascript
整理关于Bootstrap过渡动画的慕课笔记
Mar 29 Javascript
jquery.uploadifive插件怎么解决上传限制图片或文件大小问题
May 08 jQuery
使用Browserify来实现CommonJS的浏览器加载方法
May 14 Javascript
JavaScript实现重力下落与弹性效果的方法分析
Dec 20 Javascript
Js面试算法详解
Apr 08 Javascript
layui table 参数设置方法
Aug 14 Javascript
inquirer.js一个用户与命令行交互的工具详解
May 18 Javascript
基于JavaScript实现跳转提示页面
Sep 24 #Javascript
JavaScript实现DOM对象选择器
Sep 24 #Javascript
用瀑布流的方式在网页上插入图片的简单实现方法
Sep 23 #Javascript
浅谈Web页面向后台提交数据的方式和选择
Sep 23 #Javascript
Angular中使用ui router实现系统权限控制及开发遇到问题
Sep 23 #Javascript
打造自己的jQuery插件入门教程
Sep 23 #Javascript
jQuery.uploadify文件上传组件实例讲解
Sep 23 #Javascript
You might like
php下载excel无法打开的解决方法
2013/12/24 PHP
php检测iis环境是否支持htaccess的方法
2014/02/18 PHP
PHP网页游戏学习之Xnova(ogame)源码解读(九)
2014/06/24 PHP
php实现简单文件下载的方法
2015/01/30 PHP
文字幻灯片
2006/06/26 Javascript
用JS实现一个页面多个css样式实现
2008/05/29 Javascript
IFrame跨域高度自适应实现代码
2012/08/16 Javascript
js之ActiveX控件使用说明 new ActiveXObject()
2014/03/03 Javascript
ExtJS4给Combobox设置列表中的默认值示例
2014/05/02 Javascript
JavaScript 基本概念
2015/01/20 Javascript
vue-cli webpack模板项目搭建及打包时路径问题的解决方法
2018/02/26 Javascript
解决VUE中document.body.scrollTop为0的问题
2018/09/15 Javascript
Iview Table组件中各种组件扩展的使用
2018/10/20 Javascript
Vue动态面包屑功能的实现方法
2019/07/01 Javascript
JavaScript使用表单元素验证表单的示例代码
2019/08/20 Javascript
Node Express用法详解【安装、使用、路由、中间件、模板引擎等】
2020/05/13 Javascript
Vue前端判断数据对象是否为空的实例
2020/09/02 Javascript
[05:03]2018DOTA2亚洲邀请赛主赛事首日回顾
2018/04/04 DOTA
使用Python的Twisted框架实现一个简单的服务器
2015/04/16 Python
Python运算符重载详解及实例代码
2017/03/07 Python
Python3.5 创建文件的简单实例
2018/04/26 Python
Python3+django2.0+apache2+ubuntu14部署网站上线的方法
2018/07/07 Python
提升Python程序性能的7个习惯
2019/04/14 Python
Python应用领域和就业形势分析总结
2019/05/14 Python
pytorch 更改预训练模型网络结构的方法
2019/08/19 Python
Python树莓派学习笔记之UDP传输视频帧操作详解
2019/11/15 Python
python 实现生成均匀分布的点
2019/12/05 Python
解决django的template中如果无法引用MEDIA_URL问题
2020/04/07 Python
python3.8动态人脸识别的实现示例
2020/09/21 Python
Bravofly德国:预订廉价航班和酒店
2019/09/22 全球购物
回门宴父母答谢词
2014/01/26 职场文书
优秀的应届生自荐信
2014/05/23 职场文书
离婚协议书样本
2015/01/26 职场文书
农村环境卫生倡议书
2015/04/29 职场文书
运动会跳远广播稿
2015/08/19 职场文书
使用Python获取字典键对应值的方法
2022/04/26 Python