本地存储-cookie与storage

时间:2021-05-23 20:20:21

Cookie:

数据存储到计算机中,通过浏览器控制添加与删除数据

Cookie特点

1. 存储限制:

域名100个cookie,每组大小4Kb

2. 客户端、服务器端,都会请求服务器(头信息)

3. 页面间的cookie是共享

Cookie的使用:

添加、获得、删除Cookie:

<span style="font-family:Microsoft YaHei;font-size:12px;">function setCookie(name,value,iDay)   <span style="white-space:pre"></span>//Cookie名,值,过期时间
{
var oDate=new Date();
oDate.setDate(oDate.getDate()+iDay);

document.cookie=name+'='+value+';expires='+oDate;
}</span>
<span style="font-family:Microsoft YaHei;font-size:12px;">function getCookie(name){var arr=document.cookie.split('; ');for(var i=0;i<arr.length;i++){var arr2=arr[i].split('=');if(arr2[0]==name){return arr2[1];}}return '';};</span>
<span style="font-family:Microsoft YaHei;font-size:12px;">function removeCookie(name){setCookie(name,1,-1);}</span>


Storage:

1. sessionStorage:

session临时会话,从页面打开到页面关闭的时间段

窗口的临时存储,页面关闭,本地存储消失

2. localStorage

永久存储(可通过手动删除数据)

Storage的特点

1. 存储量限制(5M)

2. 客户端完成,不会请求服务器处理

3. sessionStorage数据时不共享、localStorage共享

Storage的使用:

( sessionStorage / localStorage )

Storage的添加、获取、删除:

<span style="font-family:Microsoft YaHei;font-size:12px;">window.localStorage.setItem('name',aInput[3].value); </span>
<span style="font-family:Microsoft YaHei;font-size:12px;">window.localStorage.getItem('name'));</span>
<span style="font-family:Microsoft YaHei;font-size:12px;">window.localStorage.removeItem('name');</span>
<span style="font-family:Microsoft YaHei;font-size:12px;">window.localStorage.clear();  //删除全部数据</span>