Comment puis-je montrer à tout le localStorage des variables sauvegardées?

Je veux accéder à tous les localStorage variables enregistrées sur une page spécifique. Comment dois-je faire? Je veux montrer ce que je voudrais montrer un tableau avec les join() de la fonction

InformationsquelleAutor Ariel | 2011-03-23

98

Vous pourriez essayer une itération à travers tous les éléments dans le localStorage objet:
```
for (var i = 0; i < localStorage.length; i++){
    //do something with localStorage.getItem(localStorage.key(i));
}
```
- Je sens qu'il convient de mentionner que vous pouvez obtenir le nom de la clé pour i avec localStorage.key(i)
- Peut-être quelqu'un il vous sera utile - de Prendre note qu'à l'intérieur vous ne pouvez pas removeItem de stockage, car alors localStorage.length diminuera donc for échappera plus tôt que vous le souhaitez. Si vous souhaitez supprimer des éléments de localStorage alors n'oubliez pas de cache de la longueur avant de for boucle et en boucle à partir de la fin.
- Pour de meilleures performances, la boucle doit être: for (var i = 0, l = localStorage.length; i<l; ...
- il ne fait pas de différence, la plupart des navigateurs cache localStorage.length donc ils n'ont pas à calculer à chaque fois
- Tout lien info comment une telle mise en cache fonctionne?
- Bien sûr, voir ces réponses et ce jsperf. Cela s'applique à tableaux, chaînes de caractères, localstorage, etc...
InformationsquelleAutor Greg

- Je utiliser ce bloc de code fréquemment:

var i;

console.log("local storage");
for (i = 0; i < localStorage.length; i++)   {
    console.log(localStorage.key(i) + "=[" + localStorage.getItem(localStorage.key(i)) + "]");
}

console.log("session storage");
for (i = 0; i < sessionStorage.length; i++) {
    console.log(sessionStorage.key(i) + "=[" + sessionStorage.getItem(sessionStorage.key(i)) + "]");
}

InformationsquelleAutor Mark

12

vous pouvez également vérifier localStorage le statut et les données droit dans Google chrome Developer tools
- pas vraiment une réponse à la question, mais bien de savoir de toute façon
InformationsquelleAutor jujule
7

Journal de la Console le localStorage. C'est très simple.

HTML:
```
console.log(localStorage);
```
InformationsquelleAutor Ananta Prasad

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

InformationsquelleAutor zanetu

2

De prendre des conseils de cette page, je suis maintenant en utilisant ceci:
```
new Array(localStorage.length)
  .fill()
  .map(i => localStorage.key(i));
```
Merci à tous!

InformationsquelleAutor Brook Jordan
1

Étendre ce système, le suivant récupère tout dans le localStorage.

Quel que soit le type de l'entrée, object, array,ou tout simplement un valeur.

Et d'écrire tout bien remis en place.

Utile pour enregistrer/exporter/restauration tout config!
```
function getLocalItems(k){
  if (k){
    try{
      return JSON.parse(localStorage.getItem(k))
     } catch(e){
       return localStorage.getItem(k)
    }
  }
}

function setLocalItems(k, value){
  if (typeof value === 'object') {
    value = JSON.stringify(value)
  }
  localStorage.setItem(k, value)
}

//Put all entries in an object «store»
let store = {}
for (let i = 0, l = localStorage.length; i < l; i++) {
  store[localStorage.key(i)] = getLocalItems(localStorage.key(i))
}
console.log(store)

//Write all keys of «store» in localStorage
for (let o in store) {
  setLocalItems(o, store[o])
}
```
Vous pouvez ensuite envoyer ce «magasin» de l'objet de votre serveur, pour la sauvegarde/restauration après la connexion.

Après des expériences, dans le cas d'une utilisation importante de la localStorage, c'est une bonne idée d'utiliser cette «boutique» de l'objet dans les scripts, il conserve toutes les valeurs en mémoire pour accélérer l'accès i/o, car pas dur d'écrire sur le disque.

De toute façon le localStorage est extrêmement puissant, nous pouvons faire de complexe pour animaux. L'utiliser d'une manière que vos scripts ne pas échouer si le localStorage clés sont manquantes ou endommagées.

Permettant aux utilisateurs d'effacer toutes les configs avec un bouton ou automatique après déconnexion, est également une bonne idée!

InformationsquelleAutor Cryptopat

J'ai peaufiné les script par Cryptopat à copier+coller prêt, et de travailler avec les deux localStorage ainsi que sessionStorage. C'est pratique pour reproduire l'ensemble de stockage de 1:1 sur une machine différente.

Testé sur Chrome 74.0.3729.131.

function dump(storage) {
    let store = []
    for (let i = 0, l = storage.length; i < l; i++) {
        let key = storage.key(i);
        store.push({ key: key, value: storage.getItem(key) });
    }
    console.log(JSON.stringify(store))
}

function restore(storage, store, clearBefore) {
    if (clearBefore) {
        storage.clear();
    }

    for (let i = 0, l = store.length; i < l; i++) {
        let item = store[i];
        storage.setItem(item.key, item.value);
    }
}

//usage:
//
//dump(localStorage); //manual step: copy log output to text file
//dump(sessionStorage);
//
//let contentsFromTextFile = [ ... ]; //manual step: paste from text file
//restore(localStorage, contentsFromTextFile, true);
//restore(sessionStorage, contentsFromTextFile, true);
//
//
//EXAMPLE
//-------
//Given localStorage has one entry with key "foo" and value "bar"
//And I pasted the above code into the console
//
//When I run
//   dump(localStorage)
//Then I see the log output
//   [{"key":"foo","value":"bar"}]
//
//When I run
//   restore(localStorage, [{"key":"foo2","value":"bar2"}], true);
//Then localStorage contains only one entry with key "foo2" and value "bar2"
//
//When I run
//   restore(localStorage, [{"key":"foo3","value":"bar3"}], false);
//Then localStorage contains two entries,
//  one entry with key "foo2" and value "bar2" and
//  one entry with key "foo3" and value "bar3"

Merci, c'est très bon.

InformationsquelleAutor Jan Papenbrock

Vous devez vous connecter pour publier un commentaire.