在頁面刷新時保留 JavaScript 變數值
在 JavaScript 中,刷新頁面時變數通常會遺失其值。為了克服這個限制,我們可以利用 window.localStorage 或 window.sessionStorage 方法。
window.localStorage
localStorage 允許我們儲存持久的鍵值對除了瀏覽器重新啟動之外。它適用於整個網站,而不僅僅是單一頁面。
要設定刷新後應保留的變量,請使用:
要檢索任何頁面中的持久值, use:
window.sessionStorage
sessionStorage 的工作方式與localStorage 類似,但僅在瀏覽器標籤保持開啟狀態時保留資料。它對於臨時存儲特定於會話的信息非常有用。
要使用 sessionStorage,請將上述範例中的 localStorage 替換為 sessionStorage。
注意事項:
- localStorage 和 sessionStorage 只能儲存字串。若要儲存非字串值,請使用 JSON.stringify 和 JSON.parse。
- 建議使用庫或建立自己的抽像以方便保存各種資料類型。
- 這些方法提供了站點全範圍的堅持。明智地使用它們以避免混亂和潛在的衝突。
參考文獻:
- [DOM 儲存](https://developer.mozilla.org /en-US/docs/Web/Guide/API/DOM/Storage)
- [localStorage](https://developer.mozilla.org/en-US/docs/DOM/Storage#localStorage)
- [JSON](https://developer.mozilla.org/en-US/docs/JSON)
- [瀏覽器儲存相容性](http://caniuse.com/namevalue -storage )
- [在HTML5 localStorage中儲存物件](https://www.html5rocks.com/en/tutorials/storage/using-the-storage-api/)
以上是如何在頁面刷新後保留 JavaScript 變數值?的詳細內容。更多資訊請關注PHP中文網其他相關文章!