在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 判断Flash是否加载完成的代码
Apr 12 Javascript
50款非常棒的 jQuery 插件分享
Mar 29 Javascript
javascript制作坦克大战全纪录(2)
Nov 27 Javascript
JavaScript中textRange对象使用方法小结
Mar 24 Javascript
js实现交换运动效果的方法
Apr 10 Javascript
jQuery插件EnPlaceholder实现输入框提示文字
Jun 05 Javascript
微信企业号开发之微信考勤百度地图定位
Sep 11 Javascript
使用JavaScript实现alert的实例代码
Jul 06 Javascript
vue2.0移除或更改的一些东西(移除index key)
Aug 28 Javascript
详解Vue快速零配置的打包工具——parcel
Jan 16 Javascript
基于Vue实现电商SKU组合算法问题
May 29 Javascript
JavaScript提升机制Hoisting详解
Oct 23 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遍历目录viewDir函数
2009/12/15 PHP
php学习笔记 数组遍历实现代码
2011/06/09 PHP
thinkPHP实现多字段模糊匹配查询的方法
2016/12/01 PHP
jQuery实现简单的日期输入格式化控件
2015/03/12 Javascript
javascript简单判断输入内容是否合法的方法
2016/05/11 Javascript
简易的JS计算器实现代码
2016/10/18 Javascript
一个炫酷的Bootstrap导航菜单
2016/12/28 Javascript
AngularJS实现select的ng-options功能示例
2017/07/12 Javascript
AngularJS日程表案例详解
2017/08/15 Javascript
Webpack实战加载SVG的方法
2017/12/26 Javascript
OkHttp踩坑随笔为何 response.body().string() 只能调用一次
2018/01/08 Javascript
详解webpack-dev-server使用http-proxy解决跨域问题
2018/01/13 Javascript
详解vue2.0+vue-video-player实现hls播放全过程
2018/03/02 Javascript
vue实现通讯录功能
2018/07/14 Javascript
对vux点击事件的优化详解
2018/08/28 Javascript
解决vue props 拿不到值的问题
2018/09/11 Javascript
小程序云开发部署攻略(图文教程)
2018/10/30 Javascript
inquirer.js一个用户与命令行交互的工具详解
2019/05/18 Javascript
vue 解决data中定义图片相对路径页面不显示的问题
2020/08/13 Javascript
Nuxt 嵌套路由nuxt-child组件用法(父子页面组件的传值)
2020/11/05 Javascript
[03:44]2014DOTA2国际邀请赛 71专访:DK战队赛前讨论视频遭泄露
2014/07/13 DOTA
haskell实现多线程服务器实例代码
2013/11/26 Python
用python + hadoop streaming 分布式编程(一) -- 原理介绍,样例程序与本地调试
2014/07/14 Python
Python映射拆分操作符用法实例
2015/05/19 Python
tensorflow 1.0用CNN进行图像分类
2018/04/15 Python
Python发送邮件测试报告操作实例详解
2018/12/08 Python
使用Python向DataFrame中指定位置添加一列或多列的方法
2019/01/29 Python
pytorch打印网络结构的实例
2019/08/19 Python
Ubuntu配置Pytorch on Graph (PoG)环境过程图解
2020/11/19 Python
Waterford英国官方网站:世界上最受欢迎的优质水晶品牌
2019/08/17 全球购物
个人简历自荐信
2013/12/05 职场文书
应届实习生的自我评价范文
2014/01/05 职场文书
七年级历史教学反思
2014/02/05 职场文书
员工安全生产承诺书
2014/05/22 职场文书
虚拟机linux端mysql数据库无法远程访问的解决办法
2021/05/26 MySQL
使用pandas生成/读取csv文件的方法实例
2021/07/09 Python