Comment crééer une nouvelle clé pour le local storage

Signaler
Messages postés
3
Date d'inscription
vendredi 21 mai 2021
Statut
Membre
Dernière intervention
21 mai 2021
-
Messages postés
3
Date d'inscription
vendredi 21 mai 2021
Statut
Membre
Dernière intervention
21 mai 2021
-
Bonjour,

Je débute en javascript... je coince sur un exercice que je dois faire. Il faut crééer une mini app qui ajoute des item sur la page ET dans le local storage, pour ensuite soit enlever un par un en commencant par le dernier, soit en effacant tout, yc dans local storage. Mais je n'arrive pas a créer une nouvelle clé pour chaque entrée. Voici ce que j'ai déja écrit:

```js
const textBox= document.getElementById("textBox") ;
const addItemButton=document.getElementById("addItemButton");
const removeButton=document.getElementById("removeButton");
const clearButton = document.getElementById("clearButton");
const content = document.getElementById("content");


function addItem(){
    const newItem = document.createElement("p");
    newItem.innerText = textBox.value;
    newItem.className="para"
    content.appendChild(newItem);
    document.getElementById("textBox").value = "";
    localStorage.setItem("item", textBox.value)
    // addToLocal();
    
}
addItemButton.addEventListener("click",addItem);
// addToLocal();


function removeLastItem(){
    const notes=document.getElementsByClassName("para");
    if (notes.length > 0){
        const lastPos = notes.length-1;
        content.removeChild(notes[lastPos]);
    }
}
removeButton.addEventListener("click", removeLastItem);


function clearAll(){
    const notes=document.getElementsByClassName("para");
    if (notes.length ==0){
        console.log("There is nothing to remove");
    }while (notes.length >0){
        const lastPos = notes.length-1;
        content.removeChild(notes[lastPos]);  
    }
}
clearButton.addEventListener("click", clearAll);
```
Jusqu'ici, tout va bien.. mais local.storage, pas du tout.. J'ai fait un essai:

```js
function addToLocal(){
    const notes=document.getElementsByClassName("para")
    for (i = 0; i < notes.length ; i=i+1) {
    const key = notes[i];
    const keys = key + i;
    //localStorage.setItem(keys, notes)
    console.log(keys, notes);
       }
    }

```

EDIT : Ajout des balises de code

Mais je ne vois pas trop.. vous arrivez à m'aider? JSON interdit!! Merci!

2 réponses

Messages postés
32980
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
16 juin 2021
3 560
Bonjour,

Déjà, à l'avenir, merci d'utiliser les balises de code pour poster du code sur le forum
Explications à lire entièrement, disponibles ici: https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code


que donne ceci :
function addToLocal(){
    let notes=document.getElementsByClassName("para")
    for (i = 0; i < notes.length ; i=i+1) {
       let key = notes[i];
       localStorage.setItem('note'+i, notes);
       console.log('note'+i, notes);
       }
    }


au passage, tu remarqueras que je n'ai pas utilisé de "const" ..... const c'est pour des CONSTANTES.
Pour les variables, il faut utiliser LET ou VAR selon ton besoin. ( tu trouveras sur le net les explications concernant leur utilisation... la portée des variables... )

Messages postés
3
Date d'inscription
vendredi 21 mai 2021
Statut
Membre
Dernière intervention
21 mai 2021

Bonsoir! Merci!
J'ai répondu à la question au lieu de commenter ta réponse, j'ai les yeux qui se croisent, a priori...
Merci pour le code. Mais le problème est que cela n'affiche pas la valeur, donc impossible de recharger la page avec. Je n'ai pas encore trouvé comment faire. Merci, et encore désolée pour les balises
Messages postés
3
Date d'inscription
vendredi 21 mai 2021
Statut
Membre
Dernière intervention
21 mai 2021

Bonsoir!!

Merci beaucoup! Et désolée pour les balises, j'ai mal cherché.. je garde précieusement le lien! C'est vraiment sympa.
Tout n'est pas encore très clair concernant quand utiliser les variables... je vais y travailler! Merci encore, bonne soirée