继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

Web前端基礎知識

高慕程
关注TA
已关注
手记 23
粉丝 2
获赞 20

請多多指教!

今天來講講客戶端存儲數據:

  1. locaStorage:長久保存整個網站的數據,保存的數據沒有過期時間,直到手動刪除。(永久性存儲)。

  2. sessionStorage:用於臨時保存數據,當頁面關閉或刷新時,數據就會刪除。(臨時存儲)。

在使用它們兩個前都先檢查瀏覽器是否支持:

if(typeof(Storage)!=="undefined"){

//瀏覽器支持localStorage,sessionStorage對象

}

else{

//瀏覽器不支持localStorage,sessionStorage對象

}

兩個對象所能使用的方法都是相同的:

  1. 存儲數據:localStorage.setltem(key,value);

  2. 讀取數據:localStorage.getltem(key);

  3. 刪除單個數據:localStorage.removeltem(key);

  4. 刪除所有數據:localStorage.clear();====這個常用于手動刪除數據

  5. 得到某個索引的key:localStorage.key(index);

注:

在存儲前,若是存儲的是一個對象,就先將對象轉為字符串:字符串=Json.stringify(對象);

在取得數據后,把數據轉為對象:對象=Json.parse(字符串);

再獲取對象值:對象[index].名稱;(index為對象下標);

實例:

if(typeof(Storage)!=="undefined"){
var obj={"name":"慕課網"};
var str=Json.stringify(obj);
localStorage.setltem("log",str);
var getStr=localStorage.getltem("log");
var getObj=Json.parse(getStr);
console.log("得到名字:"+getObj.name);
}
else{
alert("瀏覽器不支持web存儲")
}


打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP