JS30-Day15-LocalStorage - iT 邦幫忙 | vue set localstorage
Day15-課題內容今天我們要將資料從頁面中的程式碼儲存到Web瀏覽器的儲存空間當中。如此一來,本來存入程式碼當中的資料,就不會因重新整理頁面或者關閉瀏覽器而消失。[1]實作連結[1]WebStorageobject透過HTML中的webstorage物件,可以將網頁中的資料儲存在使用者的瀏覽器當中。[2]在HTML5問世之前,我們只能將小筆的資料儲存在cookies當中。在HTML5問世之後,Webstorage提供了一個更加安全且容量更大的本地端儲存空間,除此之外也不會影響到網頁的效能。webstorage種類webstorage物件分為兩種,雖然都能將資料暫存在當下頁面(頁籤)的...
Day15-課題內容今天我們要將資料從頁面中的程式碼儲存到Web瀏覽器的儲存空間當中。如此一來,本來存入程式碼當中的資料,就不會因重新整理頁面或者關閉瀏覽器而消失。[1]實作連結[1]
Web Storage object透過HTML中的 web storage 物件, 可以將網頁中的資料儲存在使用者的瀏覽器當中。[2]在 HTML5 問世之前,我們只能將小筆的資料儲存在cookies當中。在 HTML5 問世之後, Web storage 提供了一個更加安全且容量更大的本地端儲存空間,除此之外也不會影響到網頁的效能。
web storage 種類web storage 物件分為兩種,雖然都能將資料暫存在當下頁面(頁籤)的空間Storage物件裡,但是資料保存的時間不同。[3][4]
window.sessionStorage :放在sessionStorage的資料會在頁面(頁籤)關閉時清空,只要該頁面頁面(頁籤)沒被關閉或者有還原(restore)該頁面,資料就會保存。 window.localStorage : 放在localStorage的資料會永久保存,直到被使用者清除。 web storage methodStorage.setItem(key, value):透過在 setItem() 方法中指定物件屬性的 key 以及 value ,我們可以在 storage 物件中加入屬性或修改原本的屬性內容。
Storage.getItem(key):透過在 getItem() 方法中輸入屬性的 key ,我們可以得到 storage 物件對應的屬性 value 。
Storage.key():透過在 key() 方法中輸入屬性的順序位置,我們可以取得storage 物件中該位置的屬性 key ,此順序位置如陣列一樣,由0開始。
Storage.removeItem():透過在 removeItem() 方法,我們可以把指定的屬性從storage 物件中移除。
Storage.clear():透過 clear(...