Cum pot obține o listă a elementelor stocate în memoria locală html 5 din javascript? (Programare, Javascript, Html)

Kyle a intrebat.

Cum pot obține o listă a elementelor stocate în memoria locală html 5 din javascript?

6 răspunsuri
KJYe.Name 葉家仁

De la Referință HTML5:

Ca și alte obiecte JavaScript, puteți trata obiectul localStorage ca pe o matrice asociativă. În loc să folosiți metodele getItem() și setItem(), puteți folosi pur și simplu paranteze pătrate.

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

Acest lucru va ieși:

testing 3
testing 2
testing 1

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

Aici este Demo JSFiddle

Comentarii

  • A funcționat pentru mine în Chrome, dar Firefox 3.6 a aruncat eroarea „TypeError: null has invalid iterator valoarea null” –  > Por Kyle.
  • @Kyle funcționează foarte bine în firefox 4. a ieșit ieri, lăsați-mă să verific pentru 3.6 –  > Por KJYe.Name 葉家仁.
  • @Kyle Chiar dacă Firefox suportă localStorage, acesta poate fi dezactivat. Verificați dacă este activat. Mergeți la about:config și verificați dacă dom.storage.enabled este setat la true. –  > Por KJYe.Name 葉家仁.
  • da, este activat. Și când se face console.debug(localStorage), , pot vedea variabilele de test în ea. –  > Por Kyle.
  • @Kyle poți să rulezi demo-ul jsfiddle și să vezi dacă primești aceeași eroare? –  > Por KJYe.Name 葉家仁.
Richard Hutta

localStorage este o referință la obiectul window.Storage, așa că îl puteți folosi ca pe orice alt obiect:

Obțineți o matrice de elemente

Object.keys(localStorage)

Obținerea lungimii

Object.keys(localStorage).length

Iterați cu jquery

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

Comentarii

  • jQuery?! Facepalm. Object.keys(localStorage).forEach(key => console.log(localStorage[key])); –  > Por c24w.
  • Există o modalitate de a obține intrări pentru toate domeniile, în loc de cel din fila curentă? –  > Por mins.
Yukulélé

puteți utiliza Object.assign():

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

Comentarii

  • O soluție grozavă cu mult mai puțin cruft –  > Por maxshuty.
Mike Lewis

Din moment ce localStorage este key-value cu șiruri, doar serializați-l cu JSON și deserializați-l atunci când doriți să îl recuperați.

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

Pavel Durov

Ce zici de:

Object.keys(localStorage).map(k => localStorage.getItem(k))

Lucas D

Puteți utiliza localStorage ca un obiect simplu, dar nu este recomandat.

Iată o soluție mai sigură:

for (let i = 0; i < localStorage.length; i++) {
    const key = localStorage.key(i);
    const value = localStorage.getItem(key);
    console.log({key, value})
}