数据的持久化之本地存储

最新推荐文章于 2024-07-26 12:02:31 发布

是欢欢啊

最新推荐文章于 2024-07-26 12:02:31 发布

阅读量249

点赞数

分类专栏： JS相关

本文链接：https://blog.csdn.net/bznhlhh/article/details/115540596

版权

JS相关专栏收录该内容

42 篇文章 0 订阅

订阅专栏


<!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>本地存储和会话存储</title>
</head>
<body>
    
</body>
<script>
    //数据的持久化,可以通过本地存储localstorage对象实现;
    //向浏览器中持久化存储数据
    //本地存储、回话存储只能存储字符串类型数据;
    //但是在工作中引用类型数据存储比较常见:JSON;
    localStorage.setItem("index","我是一个要存储的数据");

    //JSON.stringify:可以将引用数据类型变为字符串;
    localStorage.setItem("k",JSON.stringify({"a":1}));
    
    //读取浏览器中存储数据;
    var result = localStorage.getItem("index");
    var result1 = localStorage.getItem("k");
    console.log(result);//我是一个要存储的数据
    console.log(result1);//{"a":1}

    console.log(typeof JSON.stringify({"a":1}));//string
    console.log(JSON.stringify({"a":1}));//{"a":1}
    //JSON.parse:可以把数据变为引用类型
    var a = '[1,2,3,4,5]';
    console.log(JSON.parse(a));//0: 1
                               //1: 2
                               //2: 3
                               //3: 4
                               //4: 5
    console.log(typeof JSON.parse(a));//object



    //会话存储
    //会话存储利用sessionStorage实现,当网页关闭，电脑关机时信息也会随之被删除
    sessionStorage.setItem("ks","我是一个大帅哥，哈哈哈哈哈");
    console.log(sessionStorage.getItem("ks")); //我是一个大帅哥，哈哈哈哈哈
</script>
</html>