localStorage和sessionStorage的使用

最新推荐文章于 2024-07-06 00:11:00 发布

Feliks.

最新推荐文章于 2024-07-06 00:11:00 发布

阅读量299

点赞数

分类专栏： js 笔记文章标签： javascript json 前端

本文链接：https://blog.csdn.net/qq_47770336/article/details/126150053

版权

js 同时被 2 个专栏收录

17 篇文章 1 订阅

订阅专栏

笔记

11 篇文章 1 订阅

订阅专栏

localStorage

一共有4个API：

localStorage.setItem()
localStorage.getItem()
localStorage.removeItem()
localStorage.clear()

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

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>localStorage</title>
</head>

<body>
  <h1>localStorage</h1>
  <button onclick="savaData()">点我存数据</button>
  <button onclick="readData()">点我读取数据</button>
  <button onclick="removeData()">点我删除数据</button>
  <button onclick="removeAllData()">点我删除全部数据</button>
</body>
<script>
  let p = { name: 'feliks', age: 22, sex: '男' };
  //存数据
  function savaData() {
    localStorage.setItem('user1', JSON.stringify(p))
    localStorage.setItem('msg', 'hahaha,amazing')
    localStorage.setItem('hobby', 'sing-dance-rap-basketball')
  }
  //读数据
  function readData() {
    let p1 = localStorage.getItem('user1');
    console.log(JSON.parse(p1));//将json格式字符串转换成json对象
    console.log(localStorage.getItem('msg'));
    console.log(localStorage.getItem('hobby'));
  }
  //删一条
  function removeData() {
    localStorage.removeItem('msg')
  }
  //删完
  function removeAllData() {
    localStorage.clear();
  }
</script>

</html>