• Empleos
  • Sobre nosotros
  • profesionales
    • Inicio
    • Empleos
    • Cursos y retos
  • empresas
    • Inicio
    • Publicar vacante
    • Nuestro proceso
    • Precios
    • Evaluaciones
    • Nómina
    • Blog
    • Comercial
    • Calculadora de salario

0

119
Vistas
Saving variables with localStorage does not work correctly

I'm writing a function that saves me some time-persistent variables (I don't have a backend and I don't need it for this exercise), but I notice that the first variable "easy30" saves it in the html and every time I reload the page remains visible, while the second variable "easy60" does not remain. It only saves it the first time and if I reload the page it disappears... why? I basically do the exact same thing for both variables!

 const easy30 = document.getElementById('easy-30');
 const easy60 = document.getElementById('easy-60');

 function saveScoreAndTime(score, time, difficulty) {
   //EASY 30 SECONDS
   var totalScore30 = localStorage.getItem('score30');

   if (
     totalScore30 === null ||
     (+score > +totalScore30 && +time === 30 && difficulty === 'easy')
   ) {
     localStorage.setItem('score30', score);
     let newEasy30Score = localStorage.getItem('score30');
     easy30.textContent = newEasy30Score;
   }

   //EASY 60 SECONDS
   var totalScore60 = localStorage.getItem('score60');

   if (
     totalScore60 === null ||
     (+score > +totalScore60 && +time === 60 && difficulty === 'easy')
   ) {
     localStorage.setItem('score60', score);
     let newEasy60Score = localStorage.getItem('score60');
     easy60.textContent = newEasy60Score;
   }

 }
almost 3 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

So there is a problem with your code.

Why you are getting the HTML node instead of the value is because you are targeting the HTML node and forgot to add the innerHTML

so in your case you should do const easy30 = document.getElementById("easy-30").innerHTML; to get the value of that HTML node

also here is an example to get and set the localstorage

const easy30 = document.getElementById("easy-30");
const easy60 = document.getElementById("easy-60");
console.log("easy30", easy30.innerHTML);
console.log("easy60", easy60.innerHTML);

const init = async () => {
  const score30 = await localStorage.getItem("easy30");
  console.log("score30", score30);
  const score60 = await localStorage.getItem("easy60");
  console.log("score30", score60);
};

init();

const setLocalStorage = async (key) => {
  localStorage.setItem(key, 30);
};
setLocalStorage("score30");
setLocalStorage("score60");

and here is a codesandbox snippet

almost 3 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recomiéndame algunas ofertas
Necesito ayuda