HTML5 ve JavaScript'te localStorage üzerinden döngü

Bu yüzden, bir uzunluğu olduğu için localStorage'da normal bir nesne gibi döngü yapabileceğimi düşünüyordum. Bunu nasıl aşabilirim?

localStorage.setItem(1,'Lorem');
localStorage.setItem(2,'Ipsum');
localStorage.setItem(3,'Dolor');

Eğer bir yaparsam , doğru olan localStorage.lengthgeri döner 3. Yani bir for...indöngünün işe yarayacağını varsayıyorum .

Şöyle bir şey düşünüyordum:

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

Ama boşuna. Herhangi bir fikir?

Aklıma gelen diğer fikir şuydu:

localStorage.setItem(1,'Lorem|Ipsum|Dolor')
var split_list = localStorage.getItem(1).split('|');

Hangi for...iniş yapar.

keyYöntemi kullanabilirsiniz . th anahtarını localStorage.key(index)döndürür index(sıra uygulama tanımlıdır ancak siz anahtar ekleyip kaldırana kadar sabittir).

for (var i = 0; i < localStorage.length; i++){
    $('body').append(localStorage.getItem(localStorage.key(i)));
}

Sipariş önemliyse, JSON serileştirilmiş bir dizi depolayabilirsiniz:

localStorage.setItem("words", JSON.stringify(["Lorem", "Ipsum", "Dolor"]));

Taslak spesifikasyon, yapılandırılmış klonu destekleyen herhangi bir nesnenin bir değer olabileceğini iddia ediyor . Ancak bu henüz desteklenmiyor gibi görünüyor.

DÜZENLEME: Diziyi yüklemek için ona ekleyin, sonra saklayın:

var words = JSON.parse(localStorage.getItem("words"));
words.push("hello");
localStorage.setItem("words", JSON.stringify(words));

En basit yol şudur:

Object.keys(localStorage).forEach(function(key){
   console.log(localStorage.getItem(key));
});

Diğer tüm yanıtlara ek olarak , jQuery kitaplığından $ .each işlevini kullanabilirsiniz :

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

  // key magic
  // value magic

});

Sonunda, nesneyi şu şekilde alın:

JSON .parse (localStorage.getItem (localStorage.key (anahtar)));

Bu benim için Chrome'da çalışıyor:

for(var key in localStorage) {
  $('body').append(localStorage.getItem(key));
}

Buradaki önceki cevaba dayanarak, anahtar değerlerini bilmeden yerel depolamada anahtara göre döngü yapacak bir işlev var.

function showItemsByKey() {
   var typeofKey = null;
   for (var key in localStorage) {
       typeofKey = (typeof localStorage[key]);
       console.log(key, typeofKey);
   }
}

Konsol çıktısını incelerseniz, kodunuz tarafından eklenen öğelerin hepsinin bir typeof dizesine sahip olduğunu göreceksiniz. Yerleşik öğeler, işlevler {[yerel kod]} veya uzunluk özelliği durumunda bir sayıdır. Yalnızca dizeleri filtrelemek için typeofKey değişkenini kullanabilirsiniz, böylece yalnızca öğeleriniz görüntülenir.

Her ikisi de dize olarak depolandıklarından değer olarak bir sayı veya boole saklasanız bile bunun işe yaradığını unutmayın.

Tüm bu yanıtlar, tarayıcılarda localStorage uygulamaları arasındaki farkları göz ardı eder. Bu alandaki katkıda bulunanlar, açıkladıkları platformlarla yanıtlarını büyük ölçüde nitelendirmelidir. Tarayıcı çapında bir uygulama https://developer.mozilla.org/en/docs/Web/API/Window/localStorage adresinde belgelenmiştir ve çok güçlü olmasına rağmen yalnızca birkaç temel yöntem içerir. İçerikler arasında döngü yapmak, tek tek tarayıcılara özgü uygulamanın anlaşılmasını gerektirir.

localStoragebir Object.

Diğer herhangi bir Object gibi JavaScript for / in Statement ile döngü yapabiliriz .

Ve .getItem()her bir anahtarın (x) değerine erişmek için kullanacağız .

for (x in localStorage){
    console.log(localStorage.getItem(x));
}