3.04.08localStorage与sessionStorage

最新推荐文章于 2023-04-28 21:58:24 发布

以哲_ok

最新推荐文章于 2023-04-28 21:58:24 发布

阅读量176

点赞数

文章标签： javascript 前端 html5

本文链接：https://blog.csdn.net/m0_59593735/article/details/125231813

版权

本文详细介绍了HTML5中的localStorage和sessionStorage的使用，包括它们的存储方式、数据持久性和共享范围。同时，文章还探讨了JSON数据格式，包括其结构和在JavaScript中的parse与stringify方法，以及如何在localStorage和sessionStorage中存储和处理JSON数据。

摘要由CSDN通过智能技术生成

3.04.08localStorage与sessionStorage

1.本地储存数据localStorage

cookie是浏览器缓存数据的一种机制。cookie有大小限制。在同一个服务器下，且同一个浏览器下，才可以共享数据
localStorage 是新增缓存数据的方式。没有大小限制，可以永久保存数据
localStorage在同一个浏览器下就可以共享数据
其存于电脑的磁盘上：C:\Users\宽\AppData\Local\Google\Chrome\User Data\Default\Local Storage\leveldb
用法：

<!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>Document</title>
</head>
<body>
    <h3>客户端 本地储存数据 localStorage 对象</h3>

    <script>
        // cookie 是浏览器缓存数据的一种机制。 cookie 有大小限制

        // localStorage 是新增缓存数据的方式。 没有大小限制，可以永久保存数据

        // 作用：
            // 1.共享一套数据
            // 2.在当前浏览器就可以获取储存的数据
            // 3.数据是永久保存的

        // 用户名称
        var userName = "adminxxx";

        // 设置本地储存(先储存数据)
        localStorage.setItem("userName",userName);

        // 获取本地储存（然后取数据）
        var _userName = localStorage.getItem("userName");

        // 删除储存(指定的数据)
        localStorage.removeItem("userName");

        // 删除所有储存的数据
        localStorage.clear();
    </script>

</body>
</html>