Ottieni chiavi HTML5 localStorage

Mi sto solo chiedendo come ottenere tutti i valori chiave in localStorage .


Ho provato a recuperare i valori con un semplice ciclo JavaScript

 for (var i=1; i <= localStorage.length; i++) { alert(localStorage.getItem(i)) } 

Ma funziona solo se i tasti sono numeri progressivi, a partire da 1.


Come ottengo tutti i tasti, per visualizzare tutti i dati disponibili?

 for (var key in localStorage){ console.log(key) } 

EDIT: questa risposta sta ottenendo un sacco di upvotes, quindi credo che sia una domanda comune. Mi sento debitore a chiunque possa inciampare nella mia risposta e pensare che sia “giusto” solo perché è stato accettato di fare un aggiornamento. La verità è che l’esempio sopra non è davvero il modo giusto per farlo. Il modo migliore e più sicuro è farlo in questo modo:

 for ( var i = 0, len = localStorage.length; i < len; ++i ) { console.log( localStorage.getItem( localStorage.key( i ) ) ); } 

Mi piace creare un object facilmente visibile al di fuori di esso in questo modo.

 Object.keys(localStorage).reduce(function(obj, str) { obj[str] = localStorage.getItem(str); return obj }, {}); 

Faccio una cosa simile anche con i biscotti.

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

È ansible utilizzare la funzione localStorage.key (index) per restituire la rappresentazione della stringa.

Se il browser supporta HTML5 LocalStorage, dovrebbe anche implementare Array.prototype.map, abilitando questo:

 Array.apply(0, new Array(localStorage.length)).map(function (o, i) { return localStorage.key(i); }) 

Dal momento che la domanda ha menzionato la ricerca delle chiavi, ho pensato di menzionare che per mostrare ogni coppia chiave e valore, potresti farlo in questo modo (basato sulla risposta di Kevin):

 for ( var i = 0, len = localStorage.length; i < len; ++i ) { console.log( localStorage.key( i ) + ": " + localStorage.getItem( localStorage.key( i ) ) ); } 

Questo registrerà i dati nel formato "chiave: valore"

(Kevin: sentiti libero di prendere queste informazioni nella tua risposta, se vuoi!)

Sono d’accordo con Kevin, lui ha la migliore risposta, ma a volte quando hai diverse chiavi nella tua memoria locale con gli stessi valori, ad esempio vuoi che i tuoi utenti pubblici vedano quante volte hanno aggiunto i loro articoli nei loro cesti, devi mostrare loro la numero di volte, quindi si può usare questo:

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

Possiamo anche leggere il nome.

Diciamo che abbiamo salvato il valore con il nome ‘utente’ come questo

 $localStorage.user = user_Detail; 

Quindi possiamo leggerlo usando

 localStorage["ngStorage-user"]; 

L’ho usato e funziona senza problemi, non c’è bisogno di fare il ciclo for

Per quelli che citano l’uso di Object.keys(localStorage) … non perché non funzionerà in Firefox (ironicamente perché Firefox è fedele alle specifiche). Considera questo:

 localStorage.setItem("key", "value1") localStorage.setItem("key2", "value2") localStorage.setItem("getItem", "value3") localStorage.setItem("setItem", "value4") 

Perché key, getItem e setItem sono metodi prototipali Object.keys(localStorage) restituirà solo ["key2"] .

È meglio fare qualcosa del genere:

 let t = []; for (let i = 0; i < localStorage.length; i++) { t.push(localStorage.key(i)); }