Quiero hacer que este código imprima 100 números, cada número cada segundo en un ciclo for. Pero mi código imprime todos los 100 números después de un segundo. Soy principiante en Javascript. Ayúdame.
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Print 1 to 100 each Second</title> </head> <body> <div id="printnum"></div> <script> let x = ""; for (let i = 1; i<= 100; i++) { setTimeout(func,1000); function func() { x += <p>; //made change (before no semi-colon) x += i; //made change (before no semi-colon) x += "</p>"; document.getElementById("printnum").innerHTML = x; } } </script> </body> </html>(Editado): este es mi código real:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <div id="printnum"> </div> <script> let x = "<p>"; for (let i = 1; i<= 100; i++) { x += i + "<br>"; } x += "</p>"; document.getElementById("printnum").innerHTML = x; </script> </body> </html>¿Cómo imprimo cada número en cada segundo?
¿Tal vez esto ayude? En este ejemplo, no hay demora en el primer inicio.
const fn = (val, max) => { document.getElementById("printnum").innerHTML += `<p>${val}</p>`; val++; if (val <= max) setTimeout(fn, 1000, val, max); } fn(1, 10); <div id="printnum"></div>Usa este código:
let pointer = 0 let int = setInterval(()=>{ pointer++ document.getElementById("printnum").innerHTML = pointer; console.log(pointer) if (pointer > 99) { clearInterval(int) } }, 100)¡Déjame saber si resuelve tu problema o no!
Un poco tarde, pero aquí está el código de su ejemplo que se incrementa hacia arriba. Con un "sueño" de 1 segundo. Salud
for(let i = 1; i <= 100; i++) { setTimeout(() => { let div = document.getElementById("printnum") let p = document.createElement("p") div.append(i, p) }, 1000 * i); } <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <div id="printnum"> <p>0</p> </div> </body> </html>