cookie localStorage與sessionStorage的使用及區別
cookie是儲存在用戶本地終端上的數據,意思就是能把用戶的一些文字信息儲存下來,但是cookie的儲存空間特別小,一個瀏覽器能創建的 Cookie 數量最多為 300 個,並且每個不能超過 4KB,每個 Web 站點能設置的 Cookie 總數不能超過 20 個,因此現在越來越少的人使用cookie了,下面講解一下cookie的用法吧,在使用cookie的時候我們需要先設置cookie
function setCookie(name, value) {
var Days = 30;//cookie的存儲時間為30天
var exp = new Date();
exp.setTime(exp.getTime() + Days * 24 * 60 * 60 * 1000);
document.cookie = name + "=" + escape(value) + ";expires=" + exp.toGMTString();
}
setCookie("性別", "男"); //存儲name為性別,value為男的cookie
接下來我們如果使用需要獲取cookie:
function getCookie(name) {
var arr, reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)");
if(arr = document.cookie.match(reg))
return unescape(arr[2]);
else
return null;
}
var a=getCookie("性別");//獲取名為性別的cookie
console.log(a);
接下來我們刪除cookie
function delCookie(name) {
var exp = new Date();
exp.setTime(exp.getTime() - 1);
var cval = getCookie(name);//此句代碼告訴我們在刪除cookie之前我們需要先獲取cookie
if(cval != null)
document.cookie = name + "=" + cval + ";expires=" + exp.toGMTString();
}
delCookie("性別");//刪除名為性別的cookie
接下來我們來說一下localStorage與sessionStorage的區別
兩者都有大約5M的存儲空間,並且使用頻率比較高,兩者的最主要的區別就是存儲期限,localStorage存儲的數據為持久數據,而sessionStorage當你關閉瀏覽器的時候數據就沒了
if(window.localStorage){ //兼容
//alert("瀏覽器支持");
var local=window.localStorage;
local.setItem(‘name‘,‘wu‘);
local.name2=‘Mr.Wu‘;
local.setItem(‘name2‘,‘Mr.Wu‘);//修改(再存儲一遍);
localStorage.removeItem("name");//清除
localStorage.clear();//全部清除
}
if(window.sessionStorage){
//alert("瀏覽器支持");
var session=window.sessionStorage;
session.setItem(‘name‘,‘wu‘);//設置存儲
session.name2=‘Mr.Wu‘;//設置存儲
session.setItem(‘name‘,‘Mr.WuGe‘);//修改(再存儲一遍);
sessionStorage.removeItem("name");
sessionStorage.clear();
}
以上兩個代碼可以直接拿來用的 用此代碼可以實現存儲效果了
cookie localStorage與sessionStorage的使用及區別