al codificar, me encontré con este problema muy extraño. Mi código está a continuación: js
document.getElementById("id").style.width = "0%" var a = 0; setTimeout(function () { if (a <= 60) { document.getElementById("id").style.width = a + "%"; a++; } }, 100);Quiero que se ejecute 60 veces, cada vez cambiando el ancho del div en un 1%. Sin embargo, cuando ejecuto el código, el bloque if hace que finalice instantáneamente como si el tiempo de espera no funcionara. ¿Alguien puede decirme qué está mal? ¡Gracias por adelantado!
La función setTimeout se ejecuta solo una vez después de ese tiempo especificado en milisegundos.
Si desea seguir ejecutando el bloque, debe utilizar setInterval en lugar de setTimeout .
setInterval continúa llamando a la función desde que se borra el intervalo.
No olvides llamar a clearInterval una vez que alcances el objetivo.
var a = 0; const interval = setInterval(function () { if (a <= 60) { console.log("Im being called"); document.getElementById("id").style.width = a + "%"; a++; } else { // Target achieved, clearing interval console.log("Im stoping execution"); clearInterval(interval) } }, 100); #id { height: 300px; background: orange; } <div id="id"></div>