js缓存cookie,sessionStorage,localeStorage用法及区别
一直都是添加做后台,不知道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>