我只是想知道如何在中获取所有关键值localStorage
。
我试图用一个简单的JavaScript循环来检索值
for (var i=1; i <= localStorage.length; i++) {
alert(localStorage.getItem(i))
}
但是它仅在键是从1开始的渐进数字时才有效。
如何显示所有键,以便显示所有可用数据?
在ES2017中,您可以使用:
Object.entries(localStorage)
for (var key in localStorage){
console.log(key)
}
编辑:这个答案越来越多,所以我想这是一个普遍的问题。我觉得我应该归功于任何可能迷失我的答案并认为它“正确”的人,因为它被接受进行更新了。事实是,上面的示例并不是执行此操作的正确方法。最好和最安全的方法是这样做:
for ( var i = 0, len = localStorage.length; i < len; ++i ) {
console.log( localStorage.getItem( localStorage.key( i ) ) );
}
我喜欢这样创建一个容易看到的对象。
Object.keys(localStorage).reduce(function(obj, str) {
obj[str] = localStorage.getItem(str);
return obj
}, {});
我也用cookie做类似的事情。
document.cookie.split(';').reduce(function(obj, str){
var s = str.split('=');
obj[s[0].trim()] = s[1];
return obj;
}, {});
function listAllItems(){
for (i=0; i<=localStorage.length-1; i++)
{
key = localStorage.key(i);
alert(localStorage.getItem(key));
}
}
您可以使用该localStorage.key(index)
函数返回字符串表示形式,其中index
您要检索的第n个对象。
如果浏览器支持HTML5 LocalStorage,则它还应该实现Array.prototype.map,启用此功能:
Array.apply(0, new Array(localStorage.length)).map(function (o, i) {
return localStorage.key(i);
})
既然问题提到要找到键,我想我要提到要显示每个键和值对,您可以这样做(根据Kevin的回答):
for ( var i = 0, len = localStorage.length; i < len; ++i ) {
console.log( localStorage.key( i ) + ": " + localStorage.getItem( localStorage.key( i ) ) );
}
这将以“键:值”格式记录数据
(凯文:如果需要,可以随时将此信息添加到您的答案中!)
您可以这样获得键和值:
for (let [key, value] of Object.entries(localStorage)) {
console.log(`${key}: ${value}`);
}
这将在localStorage上打印所有键和值:
ES6:
for (let i=0; i< localStorage.length; i++) {
let key = localStorage.key(i);
let value = localStorage[key];
console.log(`localStorage ${key}: ${value}`);
}
我同意凯文(Kevin)的最佳答案,但是有时当您在本地存储中使用相同值的不同密钥时,例如,您希望公共用户查看他们将项目添加到购物篮中的次数,则需要向他们显示次数也可以使用以下命令:
var set = localStorage.setItem('key', 'value');
var element = document.getElementById('tagId');
for ( var i = 0, len = localStorage.length; i < len; ++i ) {
element.innerHTML = localStorage.getItem(localStorage.key(i)) + localStorage.key(i).length;
}
对于那些使用Object.keys(localStorage)
...的人,不要因为它在Firefox中不起作用(具有讽刺意味的是,因为Firefox忠于规范)。考虑一下:
localStorage.setItem("key", "value1")
localStorage.setItem("key2", "value2")
localStorage.setItem("getItem", "value3")
localStorage.setItem("setItem", "value4")
因为key,getItem和setItem是原型方法,所以Object.keys(localStorage)
只会返回["key2"]
。
您最好执行以下操作:
let t = [];
for (let i = 0; i < localStorage.length; i++) {
t.push(localStorage.key(i));
}
We can also read by the name.
Say we have saved the value with name 'user' like this
localStorage.setItem('user', user_Detail);
Then we can read it by using
localStorage.getItem('user');
I used it and it is working smooth, no need to do the for loop
文章标签:html , javascript , key , local-storage
版权声明:本文为原创文章,版权归 javascript 所有,欢迎分享本文,转载请保留出处!
评论已关闭!