localStroage本地储存

最新推荐文章于 2025-07-17 11:19:50 发布

原创最新推荐文章于 2025-07-17 11:19:50 发布 · 457 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#H5储存 #html #javascript

本文详细介绍了如何使用LocalStorage进行数据的存储、读取、删除及更新操作，包括登录信息的保存与读取，以及在移动端可能出现的问题。

<!DOCTYPE html>
<html>
<head>
   <title>本地储存</title>
</head>
<body>
   <p>直接写在JS里面了，F12去看吧。</p>
   <script>
       if(window.localStorage){
   console.log(localStorage)
   // 清空
    localStorage.setItem('$user', "");
   console.log(localStorage)

//要存入的数据，一般登陆成功后从ajax里面取出来的。
   var data={
       name:"执行",
       telphone:"13504567890",
       grade:"初级"
   }
   // 存
   localStorage.setItem("$user",JSON.stringify(data))
   // 取，建议先预备一个为空的条件，防止为null的时候渲染没位置。
   var user = JSON.parse(localStorage.getItem('$user') || '{}');
   console.log(user)
   console.log(user.name)
   // 删
   localStorage.removeItem("BMap_pservice_yzjfk2")
   // 改某个对象下的某个属性,由于没有提供现成的API，这里就有点粗暴了：1.先取出来，2.改某项属性的值，3.存回去
   var user2 = JSON.parse(localStorage.getItem('$user') || '{}');//取出
   user2.name="改名";//修改
   localStorage.setItem("$user",JSON.stringify(user2)) //存入