关于localStorage存储json数据

最新推荐文章于 2024-05-05 22:38:04 发布
最新推荐文章于 2024-05-05 22:38:04 发布
阅读量779 收藏
点赞数 1
文章标签： json 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43711204/article/details/126321460
版权

今天做项目的时候疑惑，为什么这里还要转换json数据
在这里插入图片描述
首先解释一下，JSON.stringify()是将json数据转换成字符串，那么，为什么要将json数据转换成字符串呢？是因为localStorage.setItem()只能存储字符串数据，而它不会自动将Json对象转成字符串形式。我们可以来试一下，去掉JSON.stringify()
在这里插入图片描述
然后我们查看一下浏览器，
在这里插入图片描述
啥也不是，，，，我们继续
所以我们要把他转换成字符串再存进去，把JSON.stringify()它加上看看效果。
在这里插入图片描述
这样我们就可以拿到json数据，等到用的时候把他转为对象就可以了。

愿你们健康快乐
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Html5中localStorage存储JSON数据并读取JSON数据的实现方法
12-14
那么，localStorage怎么才能实现JSON数据的存储与读取呢？ 思路：既然localStorage只能存储字符串数据，那么我们就可以先把JSON对象转换成字符串，然后用localStorage方法存储起来；等到需要用到这些JSON数据时，先...
JS 技巧
qq_34870529的博客
10-19 285
1：代码复用 - 适用于多表单验证 /* 代码复用：适用于多表单验证 */ // 验证规则配置 const scheme = { first: { required: true, }, second: { required: true, }, last: { ..
Json,Json序列化和反序列化,localStorage,sessionStorage,Cookie和IndexDB
weixin_58555796的博客
04-09 203
Json,Json序列化和反序列化,localStorage,sessionStorage,Cookie和IndexDB
解决localStorage存储JSON对象问题
最新发布
挨踢星球
05-05 420
当使用数据类型限制：只能存储字符串数据。转换非文本数据： 若要存储非字符串数据（如对象、数组等），需要使用方法将其转换为字符串，然后存储。数据获取与解析： 从中取回数据时，使用获取存储的字符串，然后通过方法将其转换回原始数据类型。// 存储对象到 localStorage// 从 localStorage 中取回并解析对象// 输出: { name: "John", age: 30 }总之，对存储的数据类型有限制。
json字符串,本地存储讲解localstorage 和 sessionstorage及cookie,模板字符串初识
你还有我
01-21 1333
json字符串 “abc123truelkgsjhgo” 普通字符串 "<h1>hgahgo</h1>" html格式字符串 键值对格式 键和值都需要用双引号去包括 ‘“name”:“yasuo”’ json用途： 在网络传输时使用。 比如前后端交互。 不能够传输对象和数组的。 只能通过字符串形式去传输数据。 所以说我们如果要传输对象和数组，我们需要将其转换为字符串。 json格式就是满足对象和数组数据结构的一种字符串 json的使用方法 JSON.parse() 把json格式
localStorage 如何存储JSON数据并读取JSON数据
m0_65274248的博客
08-29 614
localStorage 如何存储JSON数据并读取JSON数据
localStorage存储JSON
windy_03271的专栏
04-02 144
[table] |一.什麽是JSON| [/table] JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。 易于人阅读和编写。同时也易于机器解析和生成。 它基于JavaScript Programming Language, Standard ECMA-262 3rd Edition - December 1999的一个子集。 JSON采用完全独...
json字符串，localStorage本地存储
weixin_50821119的博客
01-20 1301
格式； 键值对格式 键和值都需要用双引号去包括 '{"name":"yasuo"}' json用途： 在网络传输时使用。 比如前后端交互。 不能够传输对象和数组的。 只能通过字符串形式去传输数据。 所以说我们如果要传输对象和数组，我们需要将其转换为字符串。 json格式就是满足对象和数组数据结构的一种字符串 json的使用方法： JSON.parse() 把json格式的字符串转为js中的数组或对象 json.stringify()
Vue使用localStorage存储数据的方法
12-11
在前端开发中，Vue.js 是一个非常流行的轻量级JavaScript框架，它提供了高效的...在实际开发中，要注意处理可能出现的错误，如JSON解析失败，以及在适当的时候清理`localStorage`中的数据，以避免占用过多的存储空间。
JsonManagment:一个基于LocalStorage的JSON数据存储管理系统
06-07
一个基于LocalStorage的JSON数据存储管理系统 框架 ： bootstrap —— 快速开发的目的。 json-editor —— 通过现有模式生成 JSON 编辑器 把手——html模板编译器 bowserify —— 从 npm 制作适合 bowser 的模块 ...
LocalStorage如何存储JSON对象
徐同保的专栏
08-28 891
&lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;LocalStorage如何存储JSON对象&lt;/title&gt; &lt;/head&gt; &lt;body&gt;
H5 localStorage 和 sessionStorage 对json的处理方式
10-27
H5 localStorage 和 sessionStorage 对json的处理方式
localStorage中如何存取JOSN数据
weixin_44491927的博客
11-22 590
一、定义基本格式 二、获取数据的方法 三、在localStorage存取实例
localStorage和JSON
Belle_Daisy的博客
03-18 152
本地存储localStorage和dom
localStorage存储JSON格式
mosowe
05-11 1357
localStorage.setItem() 不会自动将Json对象转成字符串形式用localStorage.setItem()正确存储JSON对象方法是：1. 存储前先用JSON.stringify()方法将json对象转换成字符串形式var obj = {"a": 1,"b": 2};obj = JSON.stringify(obj); //转化为JSON字符串localStorage.set...
js数组和JSON的本地存储（localstorage如何保存数组和JSON）
qq_45803094的博客
09-10 2464
js数组和JSON的本地存储（localstorage如何保存数组和JSON）
LocalStorage存储JSON对象
WANGBAOJUN194610的博客
06-06 355
用localStorage.setItem()正确存储JSON对象方法是： 存储前先用JSON.stringify()方法将json对象转换成字符串形式 JSON.stringify()方法可以将任意的 JavaScript 值序列化成 JSON 字符串 var obj = {"a": 1,"b": 2}; obj = JSON.stringify(obj); ...
前端localStorage用法（JSON.stringify()、join() ）
IT之一小佬的博客
06-25 277
前端localStorage用法（JSON.stringify()、join() ）
如何使用使用localStorage存储数据
05-28
需要注意的是，`localStorage`只能存储字符串类型的数据，如果需要存储其他类型的数据，可以使用`JSON.stringify`和`JSON.parse`进行转换。例如： ```javascript // 存储对象 var obj = {name: '张三', age: 18}; ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值