ITOO4.1之LocalStorage 本地存储
来源:互联网 发布:top gear 知乎 编辑:程序博客网 时间:2024/06/01 12:47
昨天在研究考试配置的时候,遇到这样一个问题:我想把配置考试第一步选好的数据存储到缓存里面,然后第四步的时候是绑定考生,需要通过选择的考试科目:
在第四步绑定考生的时候,需要用到缓存里面的课程ID,通过课程ID查询上课班,进行考生绑定。大家都遇到过,有时候我们需要将数据存储到sessionStorage和LocalStorage中,我们这样做的好处主要有以下两点:1、缓存数据2、减少对内存的占用那么如何将数据存入缓存中呢?在ITOO4.0中用到的是HTML5 LocalStorage本地存储。也算是一个比较新鲜的东西了。之前只是通过cookies,但是使用cookies缓存的话有一个不好的地方就是太小,也就是4KB左右的样子,个别浏览器支持每个域名为数不多的cookies,远远不能满足开发人员的需求。下面一张图是本地存储技术的发展历程:可以看出从cookies到LocalStorage本地存储,中间经历了好几次技术的革新。我们在使用LocalStorage的时候首先应该先检测以下浏览器是否支持本地缓存。在HTML5中,本地存储包括LocalStorage和sessionStorage,前者是一直存在本地的,后者是伴随着session的,窗口一旦关闭了数据缓存就消失了。二者的使用方法完全相同,只是存储的介质不同而已。存储数据的方法就是直接给window.localStorage添加一个属性。其读写删除等操作方法很简单,是以键值对[根据一个键值获得对应的一个值]的方式存在。<strong><span style="font-size:18px;">设置值:localStorage.name = fkg;//设置name为"fkg"或者,localStorage.setItem(‘名称’,数据)修改值:localStorage["name"] = "dyh";//设置name为"dyh"(覆盖上面的值)获取值:var name = localStorage.getItem("name");//获取name的值清除值: localStorage.removeItem("name");//清除name的值</span></strong>经常会遇到:将获得的数据转化为Json串存储还是先来了解一下什么是Json吧。JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。它基于ECMAScript的一个子集。 JSON采用完全独立于语言的文本格式,但是也使用了类似于C语言家族的习惯(包括C、C++、C#、Java、JavaScript、Perl、Python等)。这些特性使JSON成为理想的数据交换语言。 易于人阅读和编写,同时也易于机器解析和生成(一般用于提升网络传输速率)。一般表示:名称/键值代码示例:<strong><span style="font-size:18px;">var people = { "programmers": [{ "firstName": "feng", "lastName": "guigui", "email": "pmaxyt" }}</span></strong>使用LocalStorage存储Json对象<strong><span style="font-size:18px;">var people = { pmaxyt:{name:"pmaxyt",age:17}, dyh:{name:"dyh",age:18} }//要存储的JSON对象 people= JSON.stringify(people);//将JSON对象转化成字符串 localStorage.setItem("people ", people);//用localStorage保存转化好的的字符串var people= localStorage.getItem("people ");//取回students变量 people = JSON.parse(people);//把字符串转换成JSON对象</span></strong>通过上面的代码就可以存储people的Json对象了。
学习小结:
最近一段时间在ITOO4.1的研究过程中,感受最深的就是一定要学会站在巨人的肩膀上。可以回过头来借鉴一下ITOO4.0中的一些技术成果。LocalStorage本地存储在ITOO4.0中的应用,觉得很强悍哦。又学到了新的知识。小编这段时间将继续更新ITOO系列博客哦,欢迎访问!
3 0
- ITOO4.1之LocalStorage 本地存储
- HTML5本地存储之LocalStorage
- HTML5本地存储之LocalStorage
- html5之Localstorage本地存储
- js学习之HTML5 LocalStorage 本地存储
- 本地存储之application cache和localstorage
- ITOO4.1之cookie学习
- H5笔记1-本地存储localStorage
- HTML5 LocalStorage 本地存储
- HTML5 LocalStorage 本地存储
- HTML5 LocalStorage 本地存储
- localStorage用于本地存储
- HTML5 LocalStorage 本地存储
- HTML5 LocalStorage 本地存储
- HTML5 LocalStorage 本地存储
- 本地存储localstorage
- HTML5 LocalStorage 本地存储
- HTML5 LocalStorage 本地存储
- ./configure 命令详解
- 安装JDK过程中的一些注意事项
- 数据结构之图(邻接表存储,DFS和BFS遍历)
- iOS中单例模式的创建
- Python学习笔记 基础语法
- ITOO4.1之LocalStorage 本地存储
- 大数据的启蒙
- php rewrite模式
- 1193: [HNOI2006]马步距离
- Qt学习之路(10):自定义事件与事件控制的5大层次
- 什么是HTTP?Ping命令是什么?
- 线性堆栈
- 浅谈ThinkPhp里的utf8格式字符串截取
- 欢迎使用CSDN-markdown编辑器