`

localStorage存储JSON对象

 
阅读更多

localStorage是html5提供的一种本地存储的方法,可以把数据存储在本地浏览器,下次打开后仍然可以获取到存储的数据。

localStorage调用的方法

localStorage.setItem("key","value");//存储变量名为key,值为value的变量
localStorage.key = "value"//存储变量名为key,值为value的变量
localStorage.getItem("key");//获取存储的变量key的值
localStorage.key;//获取存储的变量key的值
localStorage.removeItem("key")//删除变量名为key的存储变量
localStorage.clear();//清空本地所有数据

 存储JSON对象的方法

var friends= 
{
wanglichuan:{name:"wanglichuan",age:30},
xiaonai:{name:"xiaonai",age:23}
heyichen:{name:"heyichen",age:28}
}//要存储的JSON对象
friends= JSON.stringify(students);//将JSON对象转化成字符串
localStorage.setItem("friends",friends);//用localStorage保存转化好的的字符串

 将存储好的变量取回

var friends= localStorage.getItem("friends");//取回friends变量
friends= JSON.parse(friends);//把字符串转换成JSON对象

 

分享到:
评论
1 楼 吴小帅啊 2016-11-01  
  

相关推荐

    Html5中localStorage存储JSON数据并读取JSON数据的实现方法

    思路:既然localStorage只能存储字符串数据,那么我们就可以先把JSON对象转换成字符串,然后用localStorage方法存储起来;等到需要用到这些JSON数据时,先把它们读取出来,然后再转换成JSON对象加以利用。 具体代码...

    json2.js 字符串转转json对象工具

    在JSON中,数据被表示为键值对(key-value pairs)的集合,而JavaScript对象正是以这种方式存储数据。例如,如果你有一个JSON字符串`'{"name": "John", "age": 30}'`,`JSON.parse()`可以将其转换为一个JavaScript...

    H5 localStorage 和 sessionStorage 对json的处理方式

    - JSON处理:要存储JSON对象,先将其转换为字符串,如`localStorage.setItem('key', JSON.stringify(obj))`;要读取,再反向解析,如`let obj = JSON.parse(localStorage.getItem('key'))`。 3. sessionStorage: ...

    在localStorage中存储对象数组并读取的方法

    综上所述,通过使用`JSON.stringify()`和`JSON.parse()`,我们可以有效地在`localStorage`中存储和读取对象数组,从而优化页面性能,减少对服务器的频繁请求。同时,了解`localStorage`和`sessionStorage`的特性,有...

    Json将对象转换成字符串

    1. **JSON对象和字符串**:JSON对象是键值对的集合,键必须是字符串,而值可以是多种数据类型,包括字符串、数字、数组、布尔值、null,甚至嵌套的JSON对象。将JSON对象转换为字符串,意味着将这些键值对以特定的...

    在HTML5中使用json对象的示例代码.docx

    之后,我们可以通过`localStorage.getItem()`获取存储的数据,并使用`JSON.parse()`将其还原为JSON对象: ```javascript var newStudents = localStorage.getItem("students"); newStudents = JSON.parse...

    Json对象和Java对象互转md,学习代码

    标题中的“Json对象和Java对象互转”是一个关键的话题,涉及到Web开发中数据交换和序列化的重要环节。在Java开发中,JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,广泛用于前后端交互,因为其...

    Vue使用localStorage存储数据的方法

    在存储评论对象到`localStorage`前,我们需要将其转换为字符串: ```javascript var commentStr = JSON.stringify(comment); ``` 接着,我们需要从`localStorage`中获取已有的评论数据,这通常是以数组形式存在的...

    JavaScript使用localStorage存储数据

    4. 域限制:localStorage存储的数据是与域绑定的,只能被该域下的页面访问,确保了数据的隔离性与安全性。 5. 接口和方法:localStorage提供了简单易用的接口来存储和管理数据。常见的方法包括: - setItem(key, ...

    vue实现localStorage工具类

    通过`typeof`判断传入的`value`类型,如果是对象,则使用`JSON.stringify`将其转换为字符串,并添加前缀“obj-”,最后调用`localStorage.setItem`保存数据。同时,更新`#date`键值为当前日期,用于后续的过期检查。...

    JS localStorage存储对象,sessionStorage存储数组对象操作示例

    JavaScript 的 `localStorage` 和 `sessionStorage` 提供了在客户端存储数据的能力,结合JSON的序列化和反序列化功能,可以方便地存储和读取对象和数组。通过理解并熟练运用这些技术,开发者可以更好地构建交互性强...

    JavaScript中localStorage对象存储方式实例分析

    为了解决非字符串类型数据存储的问题,可以使用JSON对象的两个方法: - JSON.stringify:将JavaScript对象转换为JSON字符串。 - JSON.parse:将JSON字符串转换回JavaScript对象。 因此,当你需要存储一个对象时,...

    json系列文章——json的使用

    - 存储:JSON格式常用于本地存储(例如浏览器的localStorage或sessionStorage)。 6. 工具支持 - JSON在线校验器:用于检查JSON的格式是否正确。 - JSON库:各种编程语言都有对应的JSON处理库,例如JavaScript的...

    json+json2

    在JavaScript的标准库中,JSON对象是在ECMAScript 5版本才被引入的,所以在一些较旧的浏览器或者不支持ECMAScript 5的环境中,开发者可能需要引用像"json.js"这样的库来添加JSON的解析和字符串化功能。这个库可能...

    json相关资料_JSON_

    JSON,全称JavaScript Object Notation,是一种轻量...此外,它也被用于本地存储,例如在浏览器的localStorage或IndexedDB中保存用户数据。通过熟悉和熟练使用JSON,开发者能够更好地设计和实现跨平台的数据交换方案。

    使用localStorage缓存js

    - 存储的数据必须是字符串类型,因此非字符串数据需要转换(如JSON对象使用 `JSON.stringify()` 和 `JSON.parse()`)。 - 如果有多个开发者协作,确保对 `localStorage` 的操作是同步的,避免数据冲突。 - 清除...

Global site tag (gtag.js) - Google Analytics