Luego de de nuestra prolongada selección de datos resolvimos este asunto que suelen tener algunos de nuestros usuarios. Te compartimos la respuesta y nuestro objetivo es servirte de mucha ayuda.
Solución:
El valor devuelto por .getElementsByClassName() es un En Vivo Lista de nodos. Que esté “en vivo” significa que a medida que cambia los elementos de la lista, la lista se actualiza automáticamente. Así, cuando Ud. retirar la clase que usó para encontrar los elementos, la lista se vuelve más corta. Debido a que está iterando con un índice numérico, termina omitiendo elementos.
Una buena manera de lidiar con eso es usar un simple while haga un bucle y opere solo en el primer elemento de la lista hasta que la lista esté vacía:
var tSomeStyleClasses = myTbl.getElementsByClassName("someStyle");
while (tSomeStyleClasses.length)
tSomeStyleClasses[0].classList.remove("someStyle");
Porque getElementsByClassName te da un En Vivo lista de elementos coincidentes. Cuando eliminas la clase del elemento en el índice 0, la lista se actualiza inmediatamente para eliminar ese elemento de la lista y barajar todos los demás. Ya que luego incrementas iel elemento ahora en el índice 0 no se procesa.
Cualquiera:
-
Trabaje su camino a través de la lista hacia atrás, o
-
Utilizar
document.querySelectorAll(".someStyle")que devuelve una lista de instantáneas, no una en vivo