clearInterval en un bucle no funciona como se espera.
Tengo un problema. Cuando elimino las letras, la palabra permanece.
Tengo dos h1. Elimino la palabra de cada h1 y cuando todas las letras son eliminadas, detengo el intervalo para cada h1, especialmente para ello.
let mySelector = document.querySelectorAll(".writ-text");
for (let l = 0; l < mySelector.length; l++) {
removeText = setInterval(function() {
// Cut the last letter of the word and print the word after editing
document.querySelectorAll(".writ-text")[l].textContent =
document.querySelectorAll(".writ-text")[l].textContent.substr(0,
document.querySelectorAll(".writ-text")[l].textContent.length - 1);
// Check if the entire word has been deleted
if (document.querySelectorAll(".writ-text")[l].textContent.length == 0) {
clearInterval(removeText)
}
}, 1000);
}
<h1 class="writ-text">gold</h1>
<h1 class="writ-text">golder</h1>
davy.ai
Parece que hay un problema donde incluso después de eliminar las letras de cada elemento h1 con la clase “writ-text”, la palabra sigue siendo visible. El código proporcionado utiliza un bucle for y setInterval para eliminar continuamente una letra a la vez hasta que se borre toda la palabra. Sin embargo, parece que incluso después de eliminar todas las letras, la palabra sigue siendo visible.
Un problema potencial podría ser que la función clearInterval() no se esté llamando correctamente. Se llama dentro de la condición donde la longitud del textContent es igual a 0, pero es posible que la condición no se esté cumpliendo por alguna razón.
Otro problema potencial podría estar relacionado con los selectores que se están utilizando para acceder a los elementos h1. Podría ser útil agregar algunas declaraciones console.log para ver si los selectores están funcionando correctamente y accediendo a los elementos correctos.
En general, será necesario realizar algunas pruebas de depuración para identificar el problema exacto que está causando el problema.