我们可以使用数据存储API将数据存储在客户端应用程序。这有助于应用程序的使用，当用户处于脱机状态，同时也可以提高性能。由于这是初学者教程，我们只将向您展示如何使用本地存储。在我们以后的教程中会学习使用其他插件。
第1步 - 添加按钮
我们将在 index.html 文件创建四个按钮。这些按钮将位于div class = "app" 的元素中。
<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步 - 添加事件监听器
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;
第3步 - 创建函数
现在，我们需要创建当按钮被点击后将调用函数。第一函数用于将数据添加到本地存储。
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");
}
如果我们点击SHOW LOCAL STORAGE按钮后，我们删除了该项目，输出将显示该项目字段则为空值。
我们还可以通过使用key() 方法将采取指数作为参数，并返回相应的索引值的元素的本地存储元素。
function getLocalStorageByKey() {
console.log(localStorage.key(0));
}
现在，当我们轻点GET BY KEY 按钮，我们将得到以下的输出。
注
当我们用key() 方法在控制台记录工作，而不是名称，即使我们通过参数0获取第一个对象。这是因为本地存储空间，按字母顺序排列存储数据。
下表列出了所有本地存储可用的方法。
| SN |
方法与说明
|
|---|---|
| 1 |
setItem(key, value)
用于将项目设置到本地存储
|
| 2 |
getItem(key)
用于从本地存储中获得项目
|
| 3 |
removeItem(key)
用于从本地存储中删除该项目
|
| 4 |
key(index)
用于通过使用在本地存储器中的项的索引获得的项目。项目是按字母顺序排序的
|
| 5 |
length()
用于检索存在于本地存储器的项目数量
|
| 6 |
clear()
用于从本地存储中删除所有的键/值对
|
上一篇：
Cordova config.xml文件
下一篇：
Cordova事件