Estoy tratando de hacer una pantalla de carga de esqueleto al tener una clase 'esqueleto' en los elementos que los estiliza y luego los elimina con javascript después de un tiempo de espera. El problema es que no puedo hacer que javascript funcione.
Aquí está mi javascript para eliminar la clase, ¿por qué no funciona?
const timeout = setTimeout(loading, 3000); function loading() { const element = document.getElementById("skeleton"); element.classList.remove("skeleton"); }Lo que creo que está sucediendo es que tienes demasiados elementos de "esqueleto" con la misma identificación, y las identificaciones tienen que ser únicas. Por lo tanto, elimine los identificadores y apunte a las clases en su lugar, y use forEach para iterar sobre cada uno de ellos para eliminar la clase.
const timeout = setTimeout(loading, 3000); function loading() { const skeletons = document.querySelectorAll('.skeleton'); skeletons.forEach(skeleton => { skeleton.classList.remove('skeleton'); }); } .skeleton { color: red; } <div class="skeleton">One</div> <div class="skeleton">Two</div> <div class="skeleton">Three</div> <div class="skeleton">Four</div>Está llamando a getElmentById en Class. ¿Puedes compartir el elemento HTML cuya identificación o clase es esqueleto? Prueba esto
function loading() { const element = document.getElementsByClassName("skeleton")[0]; element.classList.remove("skeleton"); }Creo que la razón por la que no funciona es que intentas eliminar la clase de esqueleto del esqueleto mismo. Intente apuntar al elemento principal del esqueleto y luego elimine el esqueleto del elemento principal. ¿Intentaste usar:
const parentNode=document.querySelector(".parentElem"); parentNode.removeChild(document.querySelector(".skeleton")); ¿Notó que está tratando de obtener un elemento usando getElementById mientras que declaró que el skeleton es una clase?