web-dev-qa-db-fra.com

Comment puis-je obtenir une liste des éléments stockés dans le stockage local HTML 5 à partir de javascript?

Comment puis-je obtenir une liste des éléments stockés dans le stockage local HTML 5 à partir de javascript?

javascripthtmlhtml5
38
Kyle

De référence HTML5 : 

Comme d'autres objets JavaScript, vous peut traiter l'objet localStorage en tant que un tableau associatif. À la place d'utiliser les méthodes getItem () et setItem (), vous pouvez simplement utiliser des crochets.

localStorage.setItem('test', 'testing 1');
localStorage.setItem('test2', 'testing 2');
localStorage.setItem('test3', 'testing 3');

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

//test for firefox 3.6 see if it works
//with this way of iterating it
for(var i=0, len=localStorage.length; i<len; i++) {
    var key = localStorage.key(i);
    var value = localStorage[key];
    console.log(key + " => " + value);
}

Cela produira: 

testing 3
testing 2
testing 1

test3 => testing 3
test2 => testing 2
test => testing 1

Voici la JSFiddle Demo

54
KJYe.Name

localStorage est une référence à l'objet window.Storage, vous pouvez donc l'utiliser comme un autre objet:

Obtenir un tableau d'objets

Object.keys(localStorage)

Obtenir la longueur

Object.keys(localStorage).length

Itérer avec jQuery

$.each(localStorage, function(key, value){
   .....
})
25
Richard Hutta

Puisque localStorage est une valeur-clé avec des chaînes, il suffit de le sérialiser avec JSON et de le désérialiser lorsque vous souhaitez le récupérer.

 localStorage.setItem("bar", JSON.stringify([1,2,3]));
 var foo = localStorage.getItem("bar");
 JSON.parse(foo);
 // returns [1,2,3]
1
Mike Lewis

Qu'en est-il de: 

Object.keys(localStorage).map(k => localStorage.getItem(k))
0
Pavel Durov

vous pouvez utiliser Object.assign():

var data = Object.assign({}, localStorage)
0
Yukulélé