本地浏览器缓存sessionStorage(临时存储) localStorage(长期存储)的使用

时间:2022-10-04 19:42:50

对浏览器来说,使用 Web Storage 存储键值对比存储 Cookie 方式更直观,而且容量更大,它包含两种:localStorage 和 sessionStorage

  1. sessionStorage(临时存储) :为每一个数据源维持一个存储区域,在浏览器打开期间存在,包括页面重新加载

  2. localStorage(长期存储) :与 sessionStorage 一样,但是浏览器关闭后,数据依然会一直存在

 

描述就不要了 上直接可用的项目实践js代码

 例1: 

//判断浏览器存储
if(window.localStorage){
// 定义一个容器
var storage=window.localStorage;
}

//简单的切换栏位置
$(function () {
if(storage['postwo']===undefined || !window.localStorage){
var postwo = 0;
}else{
var postwo = storage['postwo'];
}
$('.swiper-slide.text-align-center.width25.c-pointer').eq(postwo).addClass('active');
$('.list-content').eq(postwo).css('display','block');
});
例2:
var info = '定义的数据';
localStorage.setItem('info', info);//存入数据
if(!window.localStorage){
            alert("浏览器不支持localstorage");
            return false;
        }else{
            var storage=window.localStorage;
        /**
        *三种方法写入
        */ //写入a字段 storage["a"]=1; //写入b字段 storage.a=1; //写入c字段 storage.setItem("c",3);
console.log(typeof storage["a"]); console.log(typeof storage["b"]); console.log(typeof storage["c"]);
        /**
        *三种方法读取
        */
       //第一种方法读取 var a=storage.a; console.log(a); //第二种方法读取 var b=storage["b"]; console.log(b); //第三种方法读取 var c=storage.getItem("c");

}