第1步 - 添加按鈕

<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>

第2步 - 添加事件監(jiān)聽器

Cordova安全策略不允許內(nèi)嵌事件，以便我們將在index.js文件內(nèi)增加事件偵聽器。我們也將分配給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;	

第3步 - 創(chuàng)建函數(shù)

現(xiàn)在，我們需要創(chuàng)建當(dāng)按鈕被點(diǎn)擊后將調(diào)用函數(shù)。第一函數(shù)用于將數(shù)據(jù)添加到本地存儲。

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"));
}	 

如果我們點(diǎn)擊 LOCAL STORAGE 按鈕，我們將設(shè)置三個項(xiàng)目到本地存儲。如果我們點(diǎn)擊 SHOW LOCAL STORAGE 之后，控制臺會記錄我們想要的項(xiàng)目。

function removeProjectFromLocalStorage() {
   localStorage.removeItem("Project");
}

function getLocalStorageByKey() {
   console.log(localStorage.key(0));
}

注

當(dāng)我們用key() 方法在控制臺記錄工作，而不是名稱，即使我們通過參數(shù)0獲取第一個對象。這是因?yàn)楸镜卮鎯臻g，按字母順序排列存儲數(shù)據(jù)。