浏览器本地存储

最新推荐文章于 2024-05-19 14:15:00 发布

我会努力变强的

最新推荐文章于 2024-05-19 14:15:00 发布

阅读量1.9k

点赞数

分类专栏： JavaScript 文章标签： javascript 前端

本文链接：https://blog.csdn.net/qq_40837310/article/details/122955416

版权

JavaScript 专栏收录该内容

38 篇文章 8 订阅

订阅专栏

简介

本文主要介绍浏览器的本地存储
概念：

浏览器的本地存储是指浏览器端通过window.sessionStorage和window.localStorage属性来进行浏览器的本地存储的。
一般能存5M左右的数据。

说白了就是八个api 的使用。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>浏览器本地存储</title>
</head>
<body>
    
    <script>

        //首先使用sessionStorage对象。
        //增，参数是key value
        window.sessionStorage.setItem("name","yehaocong");

        //获取
        var name = window.sessionStorage.getItem("name");
        console.log("name=",name);
    
        //改
        window.sessionStorage.setItem("name","liaoxiaoyan");

        //删除
        var name = window.sessionStorage.getItem("name");
        console.log("name=",name);

        window.sessionStorage.removeItem("name");

        var name = window.sessionStorage.getItem("name");
        console.log("name=",name);

        //清空
        window.sessionStorage.clear()

        

        //其次是localStorage，api是一模一样的
        //增，参数是key value
        window.localStorage.setItem("name","yehaocong");

        //获取
        var name = window.localStorage.getItem("name");
        console.log("name=",name);
    
        //改
        window.localStorage.setItem("name","liaoxiaoyan");

        //删除
        var name = window.localStorage.getItem("name");
        console.log("name=",name);

        window.localStorage.removeItem("name");

        var name = window.localStorage.getItem("name");
        console.log("name=",name);

        //清空
        window.localStorage.clear()

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

效果：
在这里插入图片描述
浏览器的本地存储可以在开发者工具中看到。
首先要先注释掉上面的代码中删除和清空的代码：

sessionStorage和localStorage的区别是，sessionStorage会在窗口关闭重新打开后消失，而localStorage是保存在磁盘的，只有手动删除才会消失，如果获取的存储的key不存在，会返回null。

我会努力变强的

关注

0
点赞
踩
6

收藏

觉得还不错? 一键收藏
0
评论
浏览器本地存储

简介本文主要介绍浏览器的本地存储概念：浏览器的本地存储是指浏览器端通过window.sessionStorage和window.localStorage属性来进行浏览器的本地存储的。一般能存5M左右的数据。说白了就是八个api 的使用。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatibl
复制链接

扫一扫