js缓存cookie,sessionStorage,localeStorage用法及区别

最新推荐文章于 2023-09-21 13:57:57 发布

weixin_30477293

最新推荐文章于 2023-09-21 13:57:57 发布

阅读量143

点赞数

文章标签：前端 ViewUI

原文链接：http://www.cnblogs.com/pengyayuan/p/11090422.html

版权

一直都是添加做后台,不知道js还有个前端缓存,今天做网址刚好用到,大概研究一下就,感觉蛮好用的分享给大家

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>js缓存</title>
</head>
<body>

    <script>
        /*
          一.什么是web缓存？
             缓存是存储在客户端和服务端之间上的副本。
             js缓存有哪些cookie,sessionStorage,localeStorage

          二.区别
             cookie         浏览器端用,大小不能超过4k,可以设置时间,关闭窗口在有效时间内还有效果     
             sessionStorage 一般服务器用,大小5M,关闭窗口就删除了
             localeStorage  服务器用,永久,大小5M,关闭窗口一直存在,只能手动清理,或者人工删除
        */

        //@ JS cookie:设置 读取 删除
        //设置cookie
        function setCookie(name,value){
            let Days = 30;
            let exp = new Date();
            exp.setTime(exp.getTime() + Days*24*60*60*1000);
            document.cookie = name + "="+ escape(value) + ";expires=" + exp.toGMTString();
        }
 
        //获取cookie
        function getCookie(name){
            let arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");
            if(arr=document.cookie.match(reg)){
                return unescape(arr[2]); 
            }else{
            return null;
          }
        }
 
       //删除cookie
       function delCookie(name) {
           let exp = new Date();
           exp.setTime(exp.getTime() - 1);
           let cval=getCookie(name);
           if(cval!=null){
           document.cookie= name + "="+cval+";expires="+exp.toGMTString();
        } 
       }

       //@ JS sessionStorage,localeStorage:设置 读取 删除
       //以key为名称存储一个值value
       sessionStorage.setItem("key","value");
       //获取名称为key的值
       sessionStorage.getItem("key");
       //删除名称为key的信息。
       sessionStorage.removeItem("key");
       //清空所有
       sessionStorage.clear();

    </script>

</body>
</html>

转载于:https://www.cnblogs.com/pengyayuan/p/11090422.html

weixin_30477293

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
js缓存cookie,sessionStorage,localeStorage用法及区别

一直都是添加做后台,不知道js还有个前端缓存,今天做网址刚好用到,大概研究一下就,感觉蛮好用的分享给大家<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>js缓存</title></head&gt...
复制链接

扫一扫