在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 相关文章推荐
css transform 3D幻灯片特效实现步骤解读
Mar 27 Javascript
如何在指定的地方插入html内容和文本内容
Dec 23 Javascript
jquery实现保存已选用户
Jul 21 Javascript
JavaScript数值转换的三种方式总结
Jul 31 Javascript
Highcharts使用简例及异步动态读取数据
Dec 30 Javascript
判断横屏竖屏(三种)
Feb 13 Javascript
JS通过调用微信API实现微信支付功能的方法示例
Jun 29 Javascript
JQuery判断正整数整理小结
Aug 21 jQuery
vue vantUI实现文件(图片、文档、视频、音频)上传(多文件)
Oct 15 Javascript
vue 导出文件,携带请求头token操作
Sep 10 Javascript
vuex中遇到的坑,vuex数据改变,组件中页面不渲染操作
Nov 16 Javascript
JS监听Esc 键触发事键
Apr 14 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函数解决SQL injection
2006/12/09 PHP
PHP输入流php://input介绍
2012/09/18 PHP
php将字符串转化成date存入数据库的两种方式
2014/04/28 PHP
ThinkPHP CURD方法之order方法详解
2014/06/18 PHP
ThinkPHP使用smarty模板引擎的方法
2014/07/01 PHP
PHP使用socket发送HTTP请求的方法
2016/02/14 PHP
多个Laravel项目如何共用migrations详解
2018/09/25 PHP
抽出www.templatemonster.com的鼠标悬停加载大图模板的代码
2007/07/11 Javascript
js操作二级联动实现代码
2010/07/27 Javascript
jQuery.query.js 取参数的两点问题分析
2012/08/06 Javascript
js实现动态添加、删除行、onkeyup表格求和示例
2013/08/18 Javascript
JavaScript禁止页面操作的示例代码
2013/12/17 Javascript
javascript和jquery实现设置和移除文本框默认值效果代码
2015/01/13 Javascript
全面理解JavaScript中的闭包
2016/05/12 Javascript
jQuery 获取屏幕高度、宽度的简单实现案例
2016/05/17 Javascript
json传值以及ajax接收详解
2016/05/24 Javascript
深入浅析AngularJS中的一次性数据绑定 (bindonce)
2017/05/11 Javascript
详解vue 计算属性与方法跟侦听器区别(面试考点)
2018/04/23 Javascript
vue组件(全局,局部,动态加载组件)
2018/09/02 Javascript
Node.js 使用request模块下载文件的实例
2018/09/05 Javascript
解决Layui当中的导航条动态添加后渲染失败的问题
2019/09/25 Javascript
Vue移动端实现图片上传及超过1M压缩上传
2019/12/23 Javascript
Vuex的热更替如何实现
2020/06/05 Javascript
盘点提高 Python 代码效率的方法
2014/07/03 Python
Python实现递归遍历文件夹并删除文件
2016/04/18 Python
详解使用python的logging模块在stdout输出的两种方法
2017/05/17 Python
Anaconda2 5.2.0安装使用图文教程
2018/09/19 Python
原生canvas制作画图小工具的踩坑和爬坑
2020/06/09 HTML / CSS
采用冷却技术的超自然舒适度:GhostBed床垫
2018/09/18 全球购物
商务英语本科生的自我评价分享
2013/11/15 职场文书
电脑专业个人求职信范文
2014/02/04 职场文书
村党支部公开承诺书
2014/05/29 职场文书
企业三严三实学习心得体会
2014/10/13 职场文书
工作时间擅自离岗检讨书
2014/10/24 职场文书
入党自荐书范文
2015/03/05 职场文书
证券区域经理岗位职责
2015/04/10 职场文书