在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 相关文章推荐
Jquery Ajax学习实例7 Ajax所有过程事件分析示例
Mar 23 Javascript
javascript 实用的文字链提示框效果
Jun 30 Javascript
jquery的index方法实现tab效果
Feb 16 Javascript
JS判断客服QQ号在线还是离线状态的方法
Jan 13 Javascript
TinyMCE提交AjaxForm获取不到数据的解决方法
Mar 05 Javascript
JavaScript中创建对象的模式汇总
Apr 19 Javascript
jquery  实现轮播图详解及实例代码
Oct 12 Javascript
AngularJS实现的锚点楼层跳转功能示例
Jan 02 Javascript
node.js自动上传ftp的脚本分享
Jun 16 Javascript
记录一篇关于redux-saga的基本使用过程
Aug 18 Javascript
微信小程序跳转到其他网页(外部链接)的实现方法
Sep 20 Javascript
Vue之封装公用变量以及实现方式
Jul 31 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
回首过去10年中最搞笑的10部动漫,哪一部让你节操尽碎?
2020/03/03 日漫
PHP的FTP学习(一)
2006/10/09 PHP
jQuery弹出层插件简化版代码下载
2008/10/16 Javascript
javascript操作cookie的文章(设置,删除cookies)
2010/04/01 Javascript
IE与Firefox在JavaScript上的7个不同句法分享
2011/10/30 Javascript
jquery延迟加载外部js实现代码
2013/01/11 Javascript
jquery获取元素值的方法(常见的表单元素)
2013/11/15 Javascript
jQuery判断checkbox是否选中的3种方法
2014/08/12 Javascript
一个实用的图片切换支持点击切换和自动轮播
2014/09/09 Javascript
JS通过ajax动态读取xml文件内容的方法
2015/03/24 Javascript
javascript 使用for循环时该注意的问题-附问题总结
2015/08/19 Javascript
基于jQuery实现的幻灯图片切换
2016/12/02 Javascript
完美解决jQuery 鼠标快速滑过后,会执行多次滑出的问题
2016/12/08 Javascript
js中创建对象的几种方式
2017/02/05 Javascript
基于layer.js实现收货地址弹框选择然后返回相应的地址信息
2017/05/26 Javascript
nodejs 搭建简易服务器的图文教程(推荐)
2017/07/18 NodeJs
Django+Vue.js搭建前后端分离项目的示例
2017/08/07 Javascript
AngularJS中控制器函数的定义与使用方法示例
2017/10/10 Javascript
vue组件编写之todolist组件实例详解
2018/01/22 Javascript
Vue打包后出现一些map文件的解决方法
2018/02/13 Javascript
React Native开发封装Toast与加载Loading组件示例
2018/09/08 Javascript
Vue 配合eiement动态路由,权限验证的方法
2018/09/26 Javascript
Promise扫盲贴
2019/06/24 Javascript
js实现九宫格抽奖
2020/03/19 Javascript
微信小程序之滑动页面隐藏和显示组件功能的实现代码
2020/06/19 Javascript
Element Dropdown下拉菜单的使用方法
2020/07/26 Javascript
谈一谈vue请求数据放在created好还是mounted里好
2020/07/27 Javascript
Windows下PyMongo下载及安装教程
2015/04/27 Python
python实现连接mongodb的方法
2015/05/08 Python
win10系统下Anaconda3安装配置方法图文教程
2018/09/19 Python
win10子系统python开发环境准备及kenlm和nltk的使用教程
2019/10/14 Python
Python页面加载的等待方式总结
2021/02/28 Python
信息技术专业大学生个人的自我评价
2013/10/05 职场文书
生活小常识广播稿
2014/09/16 职场文书
群众路线班子对照检查材料
2014/09/25 职场文书
解决Springboot PostMapping无法获取数据的问题
2022/05/06 Java/Android