在 HTML5 和 JavaScript 中循环访问 localStorage

javascript object loops html local-storage

2022-08-30 05:09:49

所以，我想我可以像普通对象一样循环通过localStorage，因为它有一个长度。如何循环访问此内容？

localStorage.setItem(1,'Lorem');
localStorage.setItem(2,'Ipsum');
localStorage.setItem(3,'Dolor');

如果我做一个，它返回哪个是正确的。所以我假设一个循环会起作用。localStorage.length3for...in

我在想这样的事情：

for (x in localStorage){
    console.log(localStorage[x]);
}

但无济于事。有什么想法吗？

我的另一个想法是这样的

localStorage.setItem(1,'Lorem|Ipsum|Dolor')
var split_list = localStorage.getItem(1).split('|');

在其中确实有效。for...in

答案 1

您可以使用密钥方法。返回 th 键（顺序是实现定义的，但在添加或删除键之前保持不变）。localStorage.key(index)index

for (var i = 0; i < localStorage.length; i++){
    $('body').append(localStorage.getItem(localStorage.key(i)));
}

如果顺序很重要，您可以存储一个 JSON 序列化数组：

localStorage.setItem("words", JSON.stringify(["Lorem", "Ipsum", "Dolor"]));

规范草案声称，任何支持结构化克隆的对象都可以是值。但这似乎还没有得到支持。

编辑：要加载数组，请添加到其中，然后存储：

var words = JSON.parse(localStorage.getItem("words"));
words.push("hello");
localStorage.setItem("words", JSON.stringify(words));

答案 2

最简单的方法是：

Object.keys(localStorage).forEach(function(key){
   console.log(localStorage.getItem(key));
});