localStorage的用法
1.在HTML5中,本地存储是一个window的属性,包括localStorage和sessionStorage,前者是一直存在本地的,后者是伴随着session,窗口一旦关闭就消失了。二者用法完全相同
2.存储数据的方法就是直接给window.localStorage添加一个属性,localStorage里面的数据是以键值对的方式存在的,可以使用getItem()和setItem()方法设置和获取数据.
3. 向localStorage里存放多次存放相同对象名的数据时,需要先从localStorage里获取一个属性,如果该属性的值为null,则创建一个数组,存在的话,就把取出来的数据用JSON.parse()方法先转换成JSON,然后把数据存进去,存完后,再将取出来的数组,用JSON.stringify()方法将其转换成字符串形式存入.
var student = {
name:"lily",
age:20
}
var students = localStorage.students;
if(!students){
students = [];
}else{ students = JSON.parse(students);
}
students.push(student);
localStorage.players = JSON.stringify(players);
4.HTML5本地存储只能存字符串,任何格式存储的时候都会被自动转为字符串,所以读取的时候,需要自己进行类型的转换。
5.为什么要进行类型转换呢,localstorage本身不就会转换吗?是的,但是它是用toSting()强制转换的,转换后的是没有意义的字符串,或者说不是我们想要的,所以,为了数据取出来后能够操作,我们需要使用特殊的方法进行转换.下面是两者的区别
var student = {
name:"haha",
age:20
};
console.log(student.toString());//[object Object]
console.log(JSON.stringify(student));//'{"name":"haha","age":20}'有效的json字符串.
6.JSON.parse()是将一个**有效的字符串**解析成json对象.
localStorage的用法的更多相关文章
- sessionStorage和localStorage的用法,不同点和相同点
一,共同点 (1)存储时用setItem: localStorage.setItem("key","value");//以"key"为名称存 ...
- 浅谈localStorage的用法
今天接到一个任务,说是让自动调节textarea标记的输入高度,而且还要记录下来,下次登录的时候还是调节后的高度,我第一时间就想到了localStorage的用法,直接代码献上: <html l ...
- localStorage/cookie 用法分析与简单封装
本地存储是HTML5中提出来的概念,分localStorage和sessionStorage.通过本地存储,web应用程序能够在用户浏览器中对数据进行本地的存储.与 cookie 不同,存储限制要大得 ...
- window.localStorage的用法
一.什么是localStorage.sessionStorage 在HTML5中,新加入了一个localStorage特性,这个特性主要是用来作为本地存储来使用的,解决了cookie存储空间不足的问题 ...
- HTML5跳转页面并传值以及localStorage的用法
1.首先,你得在那个页面把数据存入localStorage中吧.这个是必须的! localStorage.setItem("user",JSON.stringify(data.al ...
- localStorage sessionStorage 用法
sessionStorage.getItem('key') // 获取 sessionStorage.setItem('key','value') //设置 sessionStorage.remove ...
- HTML5上的LocalStorage基本用法
1.获取localStorage的长度:window.localStorage.length 2.添加/编辑localStorage的内容:window.localStorage.setItem(键, ...
- 【前端开发】localStorage的用法
localStorage.setItem("name","value") //存储name的值 var type = localStorage.getItem ...
- 轻松实现localStorage本地存储
相信大家都知道HTML5提供了localStorage和sessionStorage两个新功能,基于这两个功能我们可以实现web资源的离线和会话存储,如果你现在还在用Cookie来临时存储网络资源的话 ...
随机推荐
- MovieReview—A dog's purpose(一只狗的使命)
Be Here Now A dog in the movie was reinc ...
- argsort argmax
argsort是将array排序并返回坐标值,默认是从小到大,添加负号-变成从大到小.这个函数并不改变原来的array. >>> a = np.array([1,5,3,1]) &g ...
- Python静态方法 类方法
通常情况下,类中函数中定义的所有函数,,都是对象的绑定方法,除此之外,还有专门的静态方法和类方法,这两个是专门给类使用的,但是对象非要调用也是不会报错的. 对象在调用的时候会把自己传递给self,也就 ...
- Bootstrap 徽章(Badges)
本章将讲解Bootstrap徽章(Badges),徽章与标签相似,主要的区别是徽章的圆角比较圆滑. 徽章(Badges)主要用于突出显示新的或未读的项,如果使用徽章,只需要把<span clas ...
- mina架构在JT/T808协议应用程序中的应用
Apache Mina Server 是一个网络通信应用框架,也就是说,它主要是对基于TCP/IP.UDP/IP协议栈的通信框架(当然,也可以提供JAVA 对象的序列化服务.虚拟机管道通信服务等),M ...
- Linux curl命令中,HTTP 302处理
在Linux中使用curl命令时,偶尔会遇到一些URL跳转到新的URL,即HTTP中的3XX(redirection,重定向 ). $curl -s -I $URL > log 这时在返回的报文 ...
- Missing letters-freecodecamp算法题目
Missing letters 1.要求 从传递进来的字母序列中找到缺失的字母并返回它. 如果所有字母都在序列中,返回 undefined. 2.思路 设定缺失变量miss 在for循环遍历字符串的各 ...
- k8s Pod的自动水平伸缩(HPA)
我们知道,当访问量或资源需求过高时,使用:kubectl scale命令可以实现对pod的快速伸缩功能 但是我们平时工作中我们并不能提前预知访问量有多少,资源需求多少. 这就很麻烦了,总不能为了需求总 ...
- 【Linux】开放指定端口设置
这里以开放tomcat的8080端口为例 1.开放Linux的8080端口 vi /etc/sysconfig/iptables 进入编辑页面,在指定位置新增以下配置 -A INPUT -m stat ...
- 一个炫酷的flash网站模板
这是一个炫酷的flash欧美网站模板,它包括首页,公司简介,留言等五个页面,界面转换非常的炫酷!他还有时间.全屏.背景音乐开关的功能!有兴趣的朋友可以看看!贴几张网站图片给大家看看! 下载后直接找到s ...