¿Cómo puedo obtener una lista de los elementos almacenados en el almacenamiento local html 5 desde javascript?

Question

¿Cómo puedo obtener una lista de los elementos almacenados en el almacenamiento local html 5 desde javascript?

Answer 1

De HTML5 reference:

Like other JavaScript objects, you can treat the localStorage object as an associative array. Instead of using the getItem() and setItem() methods, you can simply use square brackets.

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

Esta es la salida:

testing 3 
testing 2 
testing 1 

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

Aquí está el localStorage JSFiddle Demo

Answer 2

Dado que localStorage es clave-valor con cadenas, simplemente serialícela con JSON, y deserialícela cuando desee recuperarla.

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

Answer 3

es referencia al objeto window.St orage, por lo que u puede utilizarlo como cada otro objeto:

Get variedad de artículos

Object.keys(localStorage) 

Get longitud

Object.keys(localStorage).length 

Iterar con jQuery

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

Answer 4

puede utilizar Object.assign() :

var data = Object.assign({}, localStorage)