html 本地存储

安装插件 live server

 

一、cookie

cookie设置本地存储，大小只有4k，默认有效期是只有当前会话窗口，可以通过expires方法进行设置过期时间。（注意查看的时候要用live server打开）

1.添加一个cookie

      document.cookie="name='zs'";

这样我们就添加了一个cookie

 

 

2.设置一个cookie的有效期（通过expires和字符串拼接的方式进行设置）

      var date=new Date();
      date.setDate(date.getDate()+1);
      console.log(date);
        document.cookie="password='123';expires="+date.toUTCString();

 3.实现设置cookie并设置指定有效时间的函数

   function setCookie(name,value,datelast){
     date.setDate(date.getDate()+datelast);
    document.cookie=name+'='+value+";expires="+date.toUTCString();
   }
   setCookie('text','success',10);

 

4.实现通过cookie的名字查找cookie的值的函数

    var date=new Date();
      date.setDate(date.getDate()+1);
   document.cookie="password='123';expires="+date.toUTCString();
   function setCookie(name,value,datelast){
     date.setDate(date.getDate()+datelast);
    document.cookie=name+'='+value+";expires="+date.toUTCString();
   }  
 setCookie('text','success',10);
   function serach(key){
   var cookie=document.cookie;
   var result;
   var contain=cookie.split(';');
   for(var i=0;i<contain.length;i++){
   contain[i]=contain[i].split('=');
   }
   for(var i=0;i<contain.length;i++){
    if(contain[i][0]==key){
        return contain[i][1];
    }
   }
   }console.log(serach('password')); 

 

5.删除指定名字的cookie

   function del(name){
    var date1=new Date();
     date1.setDate(date1.getDate()-1);
    document.cookie=name+"=null;expires="+date1.toUTCString();
   }

二、localStorage和sessionStorage

 1.localStoryage通过.name名字=值进行设置（或者通过setItem进行设置，通过getItem进行获取）（不删除的话一直有效）

 

2.sessionStoryage和localStoryage用法差不多（不同的是只有会话的时候有效）