資訊專欄INFORMATION COLUMN
摘要：的使用屬性允許你訪問一個對象。它與相似，不同之處在于里面存儲的數(shù)據(jù)沒有過期時間設(shè)置，而存儲在里面的數(shù)據(jù)在頁面會話結(jié)束時會被清除。頁面會話在瀏覽器打開期間一直保持，并且重新加載或恢復(fù)頁面仍會保持原來的頁面會話。
sessionStorge的使用
sessionStorage 屬性允許你訪問一個 session Storage 對象。它與 localStorage 相似，不同之處在于 localStorage 里面存儲的數(shù)據(jù)沒有過期時間設(shè)置，而存儲在 sessionStorage 里面的數(shù)據(jù)在頁面會話結(jié)束時會被清除。頁面會話在瀏覽器打開期間一直保持，并且重新加載或恢復(fù)頁面仍會保持原來的頁面會話。在新標(biāo)簽或窗口打開一個頁面時會在頂級瀏覽上下文中初始化一個新的會話，這點和 session cookies 的運行方式不同
語法// 保存數(shù)據(jù)到sessionStorage
sessionStorage.setItem("key", "value");
// 從sessionStorage獲取數(shù)據(jù)
var data = sessionStorage.getItem("key");
// 從sessionStorage刪除保存的數(shù)據(jù)
sessionStorage.removeItem("key");
// 從sessionStorage刪除所有保存的數(shù)據(jù)
sessionStorage.clear();
例子
// 獲取文本輸入框
var field = document.getElementById("field");
// 檢測是否存在 autosave 鍵值
// (這個會在頁面偶然被刷新的情況下存在)
if (sessionStorage.getItem("autosave")) {
// 恢復(fù)文本輸入框的內(nèi)容
field.value = sessionStorage.getItem("autosave");
}
// 監(jiān)聽文本輸入框的 change 事件
field.addEventListener("change", function() {
// 保存結(jié)果到 sessionStorage 對象中
sessionStorage.setItem("autosave", field.value);
});
localStorage的使用
只讀的localStorage 允許你訪問一個Document 的遠(yuǎn)端（origin）對象 Storage；數(shù)據(jù)存儲為跨瀏覽器會話。 localStorage 類似于sessionStorage。區(qū)別在于，數(shù)據(jù)存儲在 localStorage 是無期限的，而當(dāng)頁面會話結(jié)束——也就是說當(dāng)頁面被關(guān)閉時,數(shù)據(jù)存儲在sessionStorage 會被清除
語法//設(shè)定
localStorage.setItem("myCat", "Tom")
//讀取
let cat = localStorage.getItem("myCat");
//移除
localStorage.removeItem("myCat");
// 移除所有
localStorage.clear();
例子
function setStyles() {
var currentColor = localStorage.getItem("bgcolor");
var currentFont = localStorage.getItem("font");
var currentImage = localStorage.getItem("image");
document.getElementById("bgcolor").value = currentColor;
document.getElementById("font").value = currentFont;
document.getElementById("image").value = currentImage;
htmlElem.style.backgroundColor = "#" + currentColor;
pElem.style.fontFamily = currentFont;
imgElem.setAttribute("src", currentImage);
}
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/53344.html
摘要：的使用屬性允許你訪問一個對象。它與相似，不同之處在于里面存儲的數(shù)據(jù)沒有過期時間設(shè)置，而存儲在里面的數(shù)據(jù)在頁面會話結(jié)束時會被清除。頁面會話在瀏覽器打開期間一直保持，并且重新加載或恢復(fù)頁面仍會保持原來的頁面會話。 sessionStorge的使用 sessionStorage 屬性允許你訪問一個 session Storage 對象。它與 localStorage 相似，不同之處在于 lo...
摘要：解決的中只有一個生命周期的鉤子也只有一句代碼報錯中的就是整個組建中的原來是寫在了使用指令的后面所以此時還沒有在組件中注冊所以會報錯誤正確代碼標(biāo)題這是一段內(nèi)容這是一段內(nèi)容這是一段內(nèi)容這是一段內(nèi)容。 用于記錄coding過程中遇到的比較難解決或者有意思的問題,包括前端/后端(Node/Db),會持續(xù)更新... 后端 Node redis集群模式下pipline報錯(2019.3.14) ...
摘要：解決的中只有一個生命周期的鉤子也只有一句代碼報錯中的就是整個組建中的原來是寫在了使用指令的后面所以此時還沒有在組件中注冊所以會報錯誤正確代碼標(biāo)題這是一段內(nèi)容這是一段內(nèi)容這是一段內(nèi)容這是一段內(nèi)容。 用于記錄coding過程中遇到的比較難解決或者有意思的問題,包括前端/后端(Node/Db),會持續(xù)更新... 后端 Node redis集群模式下pipline報錯(2019.3.14) ...
閱讀 2480·2021-10-12 10:11
閱讀 1229·2021-10-11 10:58
閱讀 3273·2019-08-30 15:54
閱讀 712·2019-08-30 13:59
閱讀 680·2019-08-29 13:07
閱讀 1407·2019-08-26 11:55
閱讀 2142·2019-08-26 10:44
閱讀 2642·2019-08-23 18:25
