¿Cómo incrementar y guardar el valor del contador en la actualización de la página?
<!DOCTYPE html> <html> <body onload="myFunction()"> <h1>Hello World!</h1> <script> var count; var index; function myFunction() { count++; alert("after count++"+count); localStorage.setItem("incCount",count); alert("index here :"+index); if(index==1){ var s=localStorage.getItem("incCount"); alert("s is"+s) } index++; localStorage.setItem("incIndex",index); var g=localStorage.getItem("incIndex"); alert("g is "+g) alert("index after index++"+index) alert("Page is loaded"); } </script> </body> </html>
Quiero aumentar el valor de la variable de conteo en 1, cada vez que actualizo la página. Pero, no funciona según mis expectativas, ¿qué debo hacer?
Lea el conteo del local storage
, conviértalo en un número usando la función Number
e increméntelo mientras lo almacena.
<!DOCTYPE html> <html> <body onload="myFunction()"> <h1>Hello World!</h1> <script> function myFunction() { let count = Number(localStorage.getItem('count')) || 0; alert(`count ${count}`); localStorage.setItem('count', count + 1); } </script> </body> </html>
Lo primero que está haciendo en la carga de la página es incrementar un count
de variables indefinidas a 1, luego almacenarlo en localStorage incCount
. Así que siempre será 1.
En su lugar, primero debe leer el valor existente e incrementarlo. (Aquí uso || 0
para manejar el caso donde aún no existe localStorage):
var count; function myFunction() { // you should probably use a better name here const previousCount = Number(localStorage.getItem("incCount")) || 0; count = previousCount + 1; localStorage.setItem("incCount",count); }
He omitido la variable index
aquí porque realmente no tengo claro qué estaba tratando de hacer con eso, o si está relacionado con la pregunta dada; para mantener un conteo incremental, solo necesita una variable.
Para incrementar un conteo en la actualización de la página, todo lo que tiene que hacer es verificar primero si ya hay un valor para esa clave incCount
o no.
Si no es así, debe crear un valor key-value
almacenamiento local y, si ya está allí, solo tiene que establecer un valor incrementado.
<!DOCTYPE html> <html> <body onload="myFunction()"> <h1>Hello World!</h1> <script> let count = 0; // change function myFunction() { const valueInLS = localStorage.getItem("incCount"); alert(valueInLS); if (valueInLS) count = valueInLS; localStorage.setItem("incCount", ++count); } </script> </body> </html>