H5本地存储sessionStorage和localStorage的区别

Posted 2020-10-13 南夏de博客

sessionStorage用于本地存储一个会话（session）中的数据，这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。因此sessionStorage不是一种持久化的本地存储，仅仅是会话级别的存储。当用户关闭浏览器窗口后，数据立马会被删除。（特别提示：新建一个标签页面以后，即使跟前一个页面的地址相同，新建标签页面也获取不到前一个页面中获取或者设置的sessionStorage）

localStorage用于持久化的本地存储，除非主动删除数据，否则数据是永远不会过期的。第二天、第二周或下一年之后，数据依然可用。localStorage所有页面都可以获取；

 

//设置localStorage+sessionStorage
localStorage.setItem("beforeTime")
sessionStorage.setItem("beforeTime")

//读取localStorage+sessionStorage
localStorage.getItem("beforeTime")
sessionStorage.getItem("beforeTime")

 

　　

cookie：jquery-cookie插件只兼容ie+火狐；不支持google;

记录倒计时秒数可以使用localStorage存贮当前秒数+当前推出页面的时间；进入页面时获取localStorage中的值；（IE10以下不支持，可以用cookie）

if (window.localStorage) {  //判断是否支持localStorage
    localStorage.setItem("timeDaoJiShiNum", "60");
    localStorage.setItem("beforeTime", new Date().getTime());
} else {  //不支持的话使用Cookie存贮
    setCookie("timeDaoJiShiNum", "60");
    setCookie("beforeTime", new Date().getTime());
}

　　操作cookies函数

//写cookies

function setCookie(name,value)
{
        var Days = 30;
        var exp = new Date();
        exp.setTime(exp.getTime() + Days*24*60*60*1000);
        document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
}

//读取cookies
function getCookie(name)
{
        var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");

        if(arr=document.cookie.match(reg))

                return unescape(arr[2]);
        else
                return null;
}

//删除cookies
function delCookie(name)
{
        var exp = new Date();
        exp.setTime(exp.getTime() - 1);
        var cval=getCookie(name);
        if(cval!=null)
        document.cookie= name + "="+cval+";expires="+exp.toGMTString();
}

　　

转自：http://blog.csdn.net/weixin_38788947/article/details/78294518