一、localStorage、cookie、sessionStorage的区别及练习1、Cookiecookies。它的大小限制在4KB左右，由前Netscape员工LouMontulli于1993年3月发明。它的主要目的是保存登录信息。例如，当您登录某网站市场时，您可以看到“记住密码”。这通常是通过在cookie中存储一段标识用户身份的数据来实现的。A。生命周期：通常是浏览器关闭的时间。如果想关闭后打开，可以为cookie设置过期时间//具体操作cookiedocument.cookie="name=value;expires=date;path=path;domain=domain;secure"//路径path;domain同域名访问；**secure**只将http转https加密传输（只在server和client之间） document.cookie='username=Darren'//'username'表示cookie名称，'Darren'表示这个对应的值姓名。假设cookie名称不存在，则创建一个新的cookie；如果存在，则修改cookie名称对应的值。//cookie访问必须使用Document对象的cookie属性；(fromw3cschool)functiongetCookie(c_name){if(document.cookie.length>0){ //先判断cookie是否为空如果为空则返回""c_start=document.cookie.indexOf(c_name+"=") //通过String对象的indexOf()检查cookie是否存在，不存在则为-1 if(c_start!=-1){c_start=c_start+c_name.length+1 //最后的+1其实就是“=”号的意思，所以得到cookie值的起始位置c_end=document.cookie。indexOf(";",c_start)//indexOf()第二个参数表示指定起始索引的位置...为了得到值的结束位置。因为要考虑是否是最后一项，所以通过是否为“;”来判断如果(c_end==-1)c_end=document.cookie.length；则符号存在； returnunescape(document.cookie.substring(c_start,c_end))//通过substring()获取值。要想理解unescape()，首先要知道escape()是干什么的。这是一个非常重要的基础。如果你想知道，你可以搜索它。文末还会讲解cookie编码的细节//substring(indexStart[,indexEnd])截取起始索引和结束索引之间的字符串子集，或者从起始索引开始直到字符串的结尾。indexStart[,indexEnd]//escape()stringescape}}return""} //通过expires设置cookie的有效期。语法如下： document.cookie="name=value;expires=date"//data：GMT（格林威治标准时间）格式的日期字符串 var_date=newDate(); _date.setDate(_date.getDate()+30);//30表示保存30天 _date.toGMTString(); //函数封装 functionsetCookie(c_name,value,expiredays){varexdate=newDate(); exdate.setDate(exdate.getDate()+expiredays); document.cookie=c_name+"="+escape(value)+((expiredays==null)?"":";expires="+exdate.toGMTString()); } //使用方法 setCookie('用户名','长林',30) inputThecookie信息中不能包含空格、分号、逗号等特殊符号，一般情况下，cookie信息以未编码的方式存储。因此，在设置cookie信息之前，先使用escape()函数对cookie值信息进行编码，然后在获取cookie值时使用unescape()函数将值转换回来。比如设置cookie的时候： document.cookie=name+"="+escape(value) 看基本用法中提到的getCookie()里面的那句： returnunescape(document.cookie.substring(c_start,c_end)) 这样就不用担心cookie值中出现特殊符号导致cookie信息错误。2.sessionStorage和localStorage的使用localStorage和sessionStorage属性允许在浏览器中存储键/值对数据。sessionStorage用于临时保存同一窗口（或标签）的数据，关闭窗口或标签后将被删除。该位置始终存在于本地。sessionStorage在浏览器关闭后立即被清除。LocalStorage的限制：1、浏览器的大小不统一，IE8以上的IE版本支持localStorage的属性2、目前所有浏览器都会将localStorage的值类型限制为string类型，也就是我们日常比较常见的JSONobject类型需要一些转换3.localStorage在浏览器隐私模式下不可读4.localStorage本质上是字符串读取。如果存储内容很多，会消耗内存空间，导致页面发生变化。卡5.localStorage不能被爬虫抓取6.与cookies相比，它可以节省带宽，但是这个只有高版本的浏览器才支持//用法varstudents={xiaomin:{name:"xiaoming",grade:1},teemo:{name:"teemo",grade:3}}students=JSON.stringify(students);//将JSON转换为字符串并存储在变量console.log(students);localStorage中。setItem("students",students);//保存变量到localStoragevarnewStudents=localStorage.getItem("students");newStudents=JSON.parse(students);//转换成JSONconsole.log(newStudents);//打印出原始对象的公共API
