<button id = "setLocalStorage">SET LOCAL STORAGE</button> <button id = "showLocalStorage">SHOW LOCAL STORAGE</button> <button id = "removeProjectFromLocalStorage">REMOVE PROJECT</button> <button id = "getLocalStorageByKey">GET BY KEY</button>執行後顯示結果如下:
Cordova安全策略不允許內嵌事件,以便我們將在index.js檔案內增加事件偵聽器。我們也將分配給window.localStorage,稍後會使用localStorage 變數。
document.getElementById("setLocalStorage").addEventListener("click", setLocalStorage); document.getElementById("showLocalStorage").addEventListener("click", showLocalStorage); document.getElementById("removeProjectFromLocalStorage").addEventListener ("click", removeProjectFromLocalStorage); document.getElementById("getLocalStorageByKey").addEventListener ("click", getLocalStorageByKey); var localStorage = window.localStorage;
現在,我們需要建立當按鈕被點選後將呼叫函式。第一函式用於將資料新增到本地儲存。
function setLocalStorage() { localStorage.setItem("Name", "John"); localStorage.setItem("Job", "Developer"); localStorage.setItem("Project", "Cordova Project"); }
function showLocalStorage() { console.log(localStorage.getItem("Name")); console.log(localStorage.getItem("Job")); console.log(localStorage.getItem("Project")); }
如果我們點選 LOCAL STORAGE 按鈕,我們將設定三個專案到本地儲存。如果我們點選 SHOW LOCAL STORAGE 之後,控制台會記錄我們想要的專案。
function removeProjectFromLocalStorage() { localStorage.removeItem("Project"); }
function getLocalStorageByKey() { console.log(localStorage.key(0)); }
當我們用key() 方法在控制台記錄工作,而不是名稱,即使我們通過引數0獲取第一個物件。這是因為本地儲存空間,按字母順序排列儲存資料。
SN |
方法與說明
|
---|---|
1 |
setItem(key, value)
用於將專案設定到本地儲存
|
2 |
getItem(key)
用於從本地儲存中獲得專案
|
3 |
removeItem(key)
用於從本地儲存中刪除該專案
|
4 |
key(index)
用於通過使用在本地儲存器中的項的索引獲得的專案。專案是按字母順序排序的
|
5 |
length()
用於檢索存在於本地儲存器的專案數量
|
6 |
clear()
用於從本地儲存中刪除所有的鍵/值對
|