在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 相关文章推荐
javascript 变量作用域 代码分析
Jun 26 Javascript
理解Javascript图片预加载
Feb 23 Javascript
javascript运算符语法全面概述
Jul 14 Javascript
使用BootStrap实现用户登录界面UI
Aug 10 Javascript
十大热门的JavaScript框架和库
Mar 21 Javascript
使用Webpack提高Vue.js应用的方式汇总(四种)
Jul 10 Javascript
JS原生轮播图的简单实现(推荐)
Jul 22 Javascript
原生js实现淘宝放大镜效果
Oct 28 Javascript
小程序实现页面顶部选项卡效果
Nov 06 Javascript
JS实现使用POST方式发送请求
Aug 30 Javascript
使用vue打包进行云服务器上传的问题
Mar 02 Javascript
Openlayers实现距离面积测量
Sep 28 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序列化函数serialize() 和 unserialize() 与原生函数对比
2015/05/08 PHP
PHP各种异常和错误的拦截方法及发生致命错误时进行报警
2016/01/19 PHP
php smtp实现发送邮件功能
2017/06/22 PHP
js实现兼容IE6与IE7的DIV高度
2010/05/13 Javascript
Javascript在IE下设置innerHTML时出现未知的运行时错误的解决方法
2011/01/12 Javascript
用nodejs实现PHP的print_r函数代码
2014/03/14 NodeJs
jQuery验证插件 Validate详解
2014/11/20 Javascript
jquery显示loading图片直到网页加载完成的方法
2015/06/25 Javascript
jQuery实现的超酷苹果风格图标滑出菜单效果代码
2015/09/16 Javascript
基于HTML+CSS,jQuery编写的简易计算器后续(添加了键盘监听)
2016/01/05 Javascript
JS中使用apply、bind实现为函数或者类传入动态个数的参数
2016/04/26 Javascript
jQuery中show与hide方法用法示例
2016/09/16 Javascript
JavaScript实现简单的日历效果
2016/09/25 Javascript
JavaScript数据结构学习之数组、栈与队列
2017/05/02 Javascript
十大 Node.js 的 Web 框架(快速提升工作效率)
2017/06/30 Javascript
Form表单上传文件(type=&quot;file&quot;)的使用
2017/08/03 Javascript
详解基于DllPlugin和DllReferencePlugin的webpack构建优化
2018/06/28 Javascript
解决webpack+Vue引入iView找不到字体文件的问题
2018/09/28 Javascript
vue+SSM实现验证码功能
2018/12/07 Javascript
实例介绍JavaScript中多种组合继承
2019/01/20 Javascript
这应该是最详细的响应式系统讲解了
2019/07/22 Javascript
JavaScript如何实现图片处理与合成
2020/05/29 Javascript
[06:37]2014DOTA2国际邀请赛 昔日王者渴望重回巅峰
2014/07/12 DOTA
[54:02]2018DOTA2亚洲邀请赛 4.1 小组赛 B组 IG vs VGJ.T
2018/04/03 DOTA
python使用新浪微博api上传图片到微博示例
2014/01/10 Python
Python itertools模块详解
2015/05/09 Python
Python 2/3下处理cjk编码的zip文件的方法
2019/04/26 Python
解决Python图形界面中设置尺寸的问题
2020/03/05 Python
termux中matplotlib无法显示中文问题的解决方法
2021/01/11 Python
解决H5的a标签的download属性下载service上的文件出现跨域问题
2019/07/16 HTML / CSS
英国最大的独立家具零售商:Furniture Village
2016/09/06 全球购物
日本著名的服饰鞋帽综合类购物网站:MAGASEEK
2019/01/09 全球购物
入党个人总结范文
2015/03/02 职场文书
2015年度保密工作总结
2015/04/24 职场文书
《家世》读后感:看家训的力量
2019/12/30 职场文书
go语言中GOPATH GOROOT的作用和设置方式
2021/05/05 Golang