关于前端JS的一些常用方法和知识

1.  关于前端数据存储
   目前只解释有三种：cookie、localStorage、sessionStorage
1. cookie
   解释：只针对当前session(会话)有效,关闭标签页即失效
   使用：

   var ckStr = document.cookie;

   JS存入cookies

   //第一种方法
   var username=document.cookie.split(";")[0].split("=")[1];
   
   //第二种方法
   //写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();
   }

   JS读取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();
   }

2. localStorage 
   解释：只针对当前session(会话)有效,关闭标签页即失效
   使用：
   

   //根据key获取对应的值;
   window.localStorage.getItem(key);
   //新增key-value,若key已存在,则更新value;
   window.localStorage.setItem(key,value);
   //根据key移除对应的值
   window.localStorage.removeItem(key);
   //移除全部key-value
   window.localStorage.clear();
   //根据索引获取对应key
   window.localStorage.key(index);

3. sessionStorage
   解释：即使关闭了标签页甚至浏览器,依然存在,下次打开页面时,依然可以直接使用,但是要注意,清除浏览器缓存时,localStorage的内容也会清理掉
   使用：

   //根据key获取对应的值;
   window.sessionStorage.getItem(key);
   //新增key-value,若key已存在,则更新value;
   window.sessionStorage.setItem(key,value);
   //根据key移除对应的值
   window.sessionStorage.removeItem(key);
   //移除全部key-value
   window.sessionStorage.clear();
   //根据索引获取对应key
   window.sessionStorage.key(index);