LocalStorage如何存储JSON对象

最新推荐文章于 2024-05-05 22:38:04 发布
最新推荐文章于 2024-05-05 22:38:04 发布
阅读量892 收藏 7
点赞数 1
分类专栏： web前端 前端技术分享 文章标签： localstorage
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/xutongbao/article/details/82146780
版权 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>LocalStorage如何存储JSON对象</title>
</head>
<body>
<script>
    var obj = {
        name: '徐同保',
        job: 'web前端'
    };
    var objString = JSON.stringify(obj);

    //setItem存储value
    localStorage.setItem("obj", objString);
 
    //getItem获取value
    var objStringNew = localStorage.getItem('obj');
    var objNew = JSON.parse(objString);
    console.log('姓名：' + objNew.name);
    console.log('职业：' + objNew.job);
</script>
</body>
</html>

也可以是数据对象

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>LocalStorage如何存储JSON对象</title>
</head>

<body>
    <script>
    var obj = [{
            name: '徐同保',
            job: 'web前端'
        },
        {
            name: '徐同保s',
            job: 'web前端s'
        }
    ];
    var objString = JSON.stringify(obj);

    //setItem存储value
    localStorage.setItem("obj", objString);

    //getItem获取value
    var objStringNew = localStorage.getItem('obj');
    var objNew = JSON.parse(objString);
    for (var i = 0; i < objNew.length; i++) {
        console.log('姓名：' + objNew[i].name);
        console.log('职业：' + objNew[i].job);        
    }

    </script>
</body>

</html>

 

 

 

徐同保
关注
  • 1
    点赞
  • 踩
  • 7
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
LocalStorage存储JSON对象的问题
十年磨一剑，沉淀……
05-26 1113
首先,localStorage是没有时间限制的数据存储 ，是以键值对的形式存储的。 var arr=[1,2,3]; localStorage.setItem("temp",arr); //会返回1,2,3 console.log(typeof localStorage.getItem("temp"));//string console.log(localStorage.getItem(...
localStorage存储JSON数据
windy_03271的专栏
03-27 1088
一.什麽是JSON JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。 易于人阅读和编写。同时也易于机器解析和生成。 它基于JavaScript Programming Language, Standard ECMA-262 3rd Edition - December 1999的一个子集。 JSON采用完全独立于语言的文本格式，但是也使用了类似于C语
localStorage 如何存储JSON数据并读取JSON数据
m0_65274248的博客
08-29 616
localStorage 如何存储JSON数据并读取JSON数据
Json,Json序列化和反序列化,localStorage,sessionStorage,Cookie和IndexDB
weixin_58555796的博客
04-09 203
Json,Json序列化和反序列化,localStorage,sessionStorage,Cookie和IndexDB
解决localStorage存储JSON对象问题
最新发布
挨踢星球
05-05 428
当使用数据类型限制：只能存储字符串数据。转换非文本数据： 若要存储非字符串数据（如对象、数组等），需要使用方法将其转换为字符串，然后存储。数据获取与解析： 从中取回数据时，使用获取存储的字符串，然后通过方法将其转换回原始数据类型。// 存储对象到 localStorage// 从 localStorage 中取回并解析对象// 输出: { name: "John", age: 30 }总之，对存储的数据类型有限制。
关于localStorage存储json数据
梦想是成为一个弓箭手
04-14 3587
有时候我们想要将一个JSON对象数据存储到localStorage中，但普通的存储肯定是不行的，因为localStorage只能存储字符串数据。//test1.html var obj = {"name":"zjp"}; localStorage.setItem('obj', obj); //这样在另一个页面中取出obj //test2.html var obj = localStorage.get
json字符串,本地存储讲解localstorage 和 sessionstorage及cookie,模板字符串初识
你还有我
01-21 1339
json字符串 “abc123truelkgsjhgo” 普通字符串 "<h1>hgahgo</h1>" html格式字符串 键值对格式 键和值都需要用双引号去包括 ‘“name”:“yasuo”’ json用途： 在网络传输时使用。 比如前后端交互。 不能够传输对象和数组的。 只能通过字符串形式去传输数据。 所以说我们如果要传输对象和数组，我们需要将其转换为字符串。 json格式就是满足对象和数组数据结构的一种字符串 json的使用方法 JSON.parse() 把json格式
js操作localStorage保存本地json文件的方法
一个专注于技术研究创新的程序员
02-06 403
【代码】js操作localStorage保存本地json文件的方法。
Html5中localStorage存储JSON数据并读取JSON数据的实现方法
09-28
在这个例子中，`str_jsonData` 将是一个包含JSON对象的字符串，可以被`localStorage` 接受并存储： ```javascript localStorage.setItem('localData', str_jsonData); // 存储字符串数据到本地 ``` 当我们需要从`...
在localStorage中存储对象数组并读取的方法
11-23
综上所述，通过使用`JSON.stringify()`和`JSON.parse()`，我们可以有效地在`localStorage`中存储和读取对象数组，从而优化页面性能，减少对服务器的频繁请求。同时，了解`localStorage`和`sessionStorage`的特性，有...
HTML5中使用json对象的实例代码
12-13
当需要从`localStorage`中恢复JSON数据时，我们可以使用`localStorage.getItem()`获取字符串，然后使用`JSON.parse()`将字符串转换回JSON对象。 ```javascript var newStudents = localStorage.getItem("students")...
localStorage存储JSON格式
mosowe
05-11 1358
localStorage.setItem() 不会自动将Json对象转成字符串形式用localStorage.setItem()正确存储JSON对象方法是：1. 存储前先用JSON.stringify()方法将json对象转换成字符串形式var obj = {"a": 1,"b": 2};obj = JSON.stringify(obj); //转化为JSON字符串localStorage.set...
localStorage.setItem()、localStorage.getItem()、JSON.stringify()、 JSON.parse()；的使用
weixin_57666779的博客
11-26 1063
localStorage对象是HTML5的客户端存储持久化数据的方案，localStorage。如果需要存储复杂类型的数据例如：数组，对象，需要。方法将数组、对象转换为字符串形式，取出时再使用。方法将字符串转换为对象、数组形式；localStorage对象。
LocalStorage存储JSON对象
WANGBAOJUN194610的博客
06-06 356
用localStorage.setItem()正确存储JSON对象方法是： 存储前先用JSON.stringify()方法将json对象转换成字符串形式 JSON.stringify()方法可以将任意的 JavaScript 值序列化成 JSON 字符串 var obj = {"a": 1,"b": 2}; obj = JSON.stringify(obj); ...
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采用完全独...
localStorage中如何存取JOSN数据
weixin_44491927的博客
11-22 591
一、定义基本格式 二、获取数据的方法 三、在localStorage存取实例
vue localstorage存储对象
03-16
Vue中可以使用localStorage来存储对象。具体步骤如下： 1. 将对象转换为JSON字符串。 2. 使用localStorage.setItem()方法将JSON字符串存储到本地存储中。 3. 使用localStorage.getItem()方法获取存储的JSON字符串...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

徐同保

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值