LocalStorage与sessionStorage的存取

最新推荐文章于 2024-07-22 08:55:10 发布

weixin_45913226

最新推荐文章于 2024-07-22 08:55:10 发布

阅读量50

点赞数

文章标签： javascript 前端 html5

本文链接：https://blog.csdn.net/weixin_45913226/article/details/123388544

版权

LocalStorage的存取：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<input type="button" onclick="setItem();" value="设置值">
<input type="button" onclick="getMethod();" value="取method">
<input type="button" onclick="getData();" value="取method">
<script>
  function setItem(){
    localStorage.setItem("method","LocalStorage");
    localStorage.setItem("data","Data local storage!");
  };

  function getMethod(){
      alert(localStorage.getItem("method"));
  };
  function getData(){
      alert(localStorage.getItem("data"));
  };
</script>
</body>
</html>

打开浏览器Application，可以看到值存到了LocalStorage：
在这里插入图片描述

SessionStorage的存取：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<input type="button" onclick="setItem();" value="设置值">
<input type="button" onclick="getMethod();" value="getMethod">
<input type="button" onclick="getData();" value="getData">
<script>
  function setItem(){
    sessionStorage.setItem("method","SessionStorage");
    sessionStorage.setItem("data","Data session storage");
  }
  function getMethod(){
      alert(sessionStorage.getItem("method"));
  }
  function getData(){
      alert(sessionStorage.getItem("data"));
  }

</script>
</body>
</html>

可看到值存到了SessionStorage：
在这里插入图片描述

weixin_45913226

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
LocalStorage与sessionStorage的存取

LocalStorage的存取：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><input type="button" onclick="setItem();" value="设置值"><input type="button"
复制链接

扫一扫