先看各個(gè)緩存的使用岭接，后面介紹優(yōu)缺點(diǎn)和不同
localStorage
// 創(chuàng)建
localStorage.setItem("name","張三")
// 讀取
localStorage.getItem("name")
// 清除制定
localStorage.removeItem("name") // undefined
// 清除全部
localStorage.clear() // undefined
// 不常用 獲取當(dāng)前storage中的元素?cái)?shù)目
localStorage.Length()
// 不常用 獲取鍵名
localStorage.key(0) // 0===獲取第一個(gè)鍵名
sessionStorage
// 創(chuàng)建
sessionStorage.setItem("name", "李四");
// 讀取
sessionStorage.getItem("name")
// 清除制定
sessionStorage.removeItem("name") // undefined
// 清除全部
sessionStorage.clear() // undefined
// 不常用 獲取當(dāng)前storage中的元素?cái)?shù)目
sessionStorage.Length()
// 不常用 獲取鍵名
sessionStorage.key(0) // 0===獲取第一個(gè)鍵名
cookie
// 設(shè)置cookie
setCookie(name,value,expiredays){//設(shè)置時(shí)間為天為過(guò)期單位
var exdate=new Date();
exdate.setDate(exdate.getDate()+expiredays);
document.cookie=name + '=' + escape(value)+((expiredays==null) ? "" : ";expires="+exdate.toGMTString())
},
// 獲取cookie
getCookie(name){
var start = document.cookie.indexOf(name+'=')
var end = document.cookie.indexOf(';',start)
if(end=-1){
end = document.cookie.length
}
return unescape(document.cookie.substring(start,end))
}
總結(jié)
一富拗、共同點(diǎn)
1. 都是保存在瀏覽器端
二、不同點(diǎn)（特點(diǎn)）
1.cookie有儲(chǔ)存4k的數(shù)據(jù)限制鸣戴；
2.cookie的數(shù)據(jù)在請(qǐng)求頭啃沪，導(dǎo)致流量增加；
3.localStorage生命周期：持久化的本地存儲(chǔ)窄锅，除非主動(dòng)刪除數(shù)據(jù)创千，否則數(shù)據(jù)是永遠(yuǎn)不會(huì)過(guò)期的；
4.localStorage存儲(chǔ)的信息在同一域中是共享的酬滤；
5.localStorage本質(zhì)上是對(duì)字符串的讀取签餐，如果存儲(chǔ)內(nèi)容多的話會(huì)消耗內(nèi)存空間，會(huì)導(dǎo)致頁(yè)面變卡盯串；
6.sessionStorage和localStorage 都受到同源策略限制氯檐；
7.sessionStorage比localStorage更嚴(yán)苛一點(diǎn)，除了協(xié)議体捏、主機(jī)名冠摄、端口外糯崎，還要求在同一窗口（也就是瀏覽器的標(biāo)簽頁(yè)）下。
8.sessionStorage當(dāng)會(huì)話結(jié)束（當(dāng)前頁(yè)面河泳、標(biāo)簽頁(yè)關(guān)閉的時(shí)候沃呢，自動(dòng)銷毀）；
9.sessionStorage和localStorage 據(jù)說(shuō)是5M. （目前沒(méi)有超過(guò)限制的）拆挥；
10.sessionStorage和localStorage只能通過(guò)客戶端操作薄霜，cookie既可以通過(guò)客戶端操作又可以通過(guò)服務(wù)端操作
個(gè)人原因（cookie用的少，所以單獨(dú)學(xué)習(xí)下）
cookie
單獨(dú)提出來(lái)cookie纸兔。照搬別人寫的惰瓜。
設(shè)置cookie的方式，及可以添加的參數(shù)
一汉矿、expires（過(guò)期時(shí)間）
過(guò)了過(guò)期時(shí)間崎坊，瀏覽器就會(huì)刪除該cookie，想要?jiǎng)h除cookie洲拇，只需要把它過(guò)期時(shí)間設(shè)置成過(guò)去的時(shí)間即可（如果不設(shè)置過(guò)期時(shí)間奈揍，則表示這個(gè)cookie生命周期為瀏覽器會(huì)話期間，只要關(guān)閉瀏覽器窗口赋续，cookie就消失了男翰。）
例如：
document.cookie = "username=linda; expires=Thu, 18 Dec 2013 12:00:00 GMT; path=/" // 設(shè)置cookie
document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 GMT" // 刪除cookie
一、path（路徑）
（值可以是一個(gè)目錄纽乱，或者是一個(gè)路徑奏篙。）
如果cc.com/test/index.html建立了一個(gè)cookie，那么在cc.com/test/目錄里的所有頁(yè)面迫淹，以及該目錄下面任何子目錄里的頁(yè)面都可以訪問(wèn)這個(gè)cookie。因此在cc.com/test/test2/test3里的任何頁(yè)面都可以訪問(wèn)cc.com/test/index.html建立的cookie为严。若cc.com/test/若想訪問(wèn)cc.com/test/index.html設(shè)置的cookie敛熬，需要把cookie的path屬性設(shè)置成“/”。
在指定路徑的時(shí)候第股，凡是來(lái)自同一服務(wù)器应民，URL里有相同路徑的所有WEB頁(yè)面都可以共享cookies。
3.domain(主機(jī)名夕吻，是指同一個(gè)域下的不同主機(jī))
例如：www.baidu.com和map.baidu.com就是兩個(gè)不同的主機(jī)名诲锹。默認(rèn)情況下，一個(gè)主機(jī)中創(chuàng)建的cookie在另一個(gè)主機(jī)下是不能被訪問(wèn)的涉馅，但可以通過(guò)domain參數(shù)來(lái)實(shí)現(xiàn)對(duì)其的控制：document.cookie = "name=value;domain=.baidu.com"
這樣归园，所有*.baidu.com的主機(jī)都可以訪問(wèn)該cookie。
可以用此特性實(shí)現(xiàn)
