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的用法的更多相关文章

  1. sessionStorage和localStorage的用法,不同点和相同点

    一,共同点 (1)存储时用setItem: localStorage.setItem("key","value");//以"key"为名称存 ...

  2. 浅谈localStorage的用法

    今天接到一个任务,说是让自动调节textarea标记的输入高度,而且还要记录下来,下次登录的时候还是调节后的高度,我第一时间就想到了localStorage的用法,直接代码献上: <html l ...

  3. localStorage/cookie 用法分析与简单封装

    本地存储是HTML5中提出来的概念,分localStorage和sessionStorage.通过本地存储,web应用程序能够在用户浏览器中对数据进行本地的存储.与 cookie 不同,存储限制要大得 ...

  4. window.localStorage的用法

    一.什么是localStorage.sessionStorage 在HTML5中,新加入了一个localStorage特性,这个特性主要是用来作为本地存储来使用的,解决了cookie存储空间不足的问题 ...

  5. HTML5跳转页面并传值以及localStorage的用法

    1.首先,你得在那个页面把数据存入localStorage中吧.这个是必须的! localStorage.setItem("user",JSON.stringify(data.al ...

  6. localStorage sessionStorage 用法

    sessionStorage.getItem('key') // 获取 sessionStorage.setItem('key','value') //设置 sessionStorage.remove ...

  7. HTML5上的LocalStorage基本用法

    1.获取localStorage的长度:window.localStorage.length 2.添加/编辑localStorage的内容:window.localStorage.setItem(键, ...

  8. 【前端开发】localStorage的用法

    localStorage.setItem("name","value")  //存储name的值 var type = localStorage.getItem ...

  9. 轻松实现localStorage本地存储

    相信大家都知道HTML5提供了localStorage和sessionStorage两个新功能,基于这两个功能我们可以实现web资源的离线和会话存储,如果你现在还在用Cookie来临时存储网络资源的话 ...

随机推荐

  1. java面试题(杨晓峰)---第二讲Exception和Error有什么区别?

    本人总结: Exception和Error:正常问题和意外问题,以自行车举例:没气和爆胎. ①理解Throwable,Exception,Error的设计和分类. ②掌握哪些应用最广泛的子类, ③如何 ...

  2. 爬取豆瓣电影top250并存储到mysql数据库

    import requests from lxml import etree import re import pymysql import time conn= pymysql.connect(ho ...

  3. UOJ#7 NOI2014 购票 点分治+凸包二分 斜率优化DP

    [NOI2014]购票 链接:http://uoj.ac/problem/7 因为太麻烦了,而且暴露了我很多学习不扎实的问题,所以记录一下具体做法. 主要算法:点分治+凸包优化斜率DP. 因为$q_i ...

  4. 棋盘问题——POJ1321

    棋盘问题——深度优先搜索 题目描述: 在一个给定形状的棋盘(形状可能是不规则的)上面摆放棋子,棋子没有区别.要求摆放时任意的两个棋子不能放在棋盘中的同一行或者同一列,请编程求解对于给定形状和大小的棋盘 ...

  5. C# 控制台应用程序输出颜色字体[更正版]

    首先感谢院子里的“yanxinchen”,之前的方法是通过c#调用系统api实现的,相比之下我的有点画蛇添足了,哈哈. 最佳解决方案的代码: static void Main(string[] arg ...

  6. helm install

    reference 前提:已安装k8s:v1.10.4 helm install on master(无需下载官方tar包) 链接:https://pan.baidu.com/s/1Ji3Ru1pTQ ...

  7. RabbitMQ 学习资料

    https://www.rabbitmq.com/getstarted.html http://www.cnblogs.com/luxiaoxun/p/3918054.html http://back ...

  8. java 第11次作业:你能看懂就说明你理解了——this关键字

    this 代表当前对象

  9. cesium底图加载底图切换 基于天地图服务

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  10. LaTeX中常用数学符号总结

    博主一些小小的总结,以后会继续更的. 某个传送门. ⎝⎛•‿•⎞⎠⎝⎛•‿•⎞⎠⎝⎛•‿•⎞⎠ 1.左右一个$: 1+1=2 $1+1=2$ ($3$及以后的都需要$) 2.左右两个$: 1+1=2 ...