Tengo una demostración relativamente simple aquí donde tengo dos elementos incrustados con la misma clase, y al cargar la página, uno está configurado para mostrarse y el otro no. Llamo a una función y establezco un intervalo cada 5 segundos a partir de la carga de la página, lo que debería alternar las reglas de visualización para las clases (solo se debe mostrar un elemento incrustado a la vez y luego deben alternarse en el temporizador).
Tengo colores de borde en los elementos incrustados para la prueba, pero parece que ninguno de los elementos se muestra en la carga de la página una vez que agregué la segunda declaración 'si' en el JS
Qué estoy haciendo mal
window.onload = function () { test(); setInterval(function() { test(); }, 5000); } function test(){ console.log('starting'); var all = document.getElementsByClassName('pdfEmbed'); for (var i = 0; i < all.length; i++) { if(all[i].style.display = "none"){ all[i].style.display = "block"; } if(all[i].style.display="block"){ all[i].style.display = "none"; } } } <embed class="pdfEmbed" src="#" style="margin-top: 40px;position:absolute; display: block; left: 0; top: 0; border: 1px solid red;" width="100%" height="100%" type="application/pdf"> <embed class="pdfEmbed" src="#" style="margin-top: 40px;position:absolute; border: 1px solid black; display: none; left: 0; top: 0;" width="100%" height="100%" type="application/pdf">Esto es lo que está pasando con el segundo if :
// set current child display to "block" if it is "none" if(all[i].style.display = "none"){ all[i].style.display = "block"; } // the check is always true, since you just set the display to "block" if(all[i].style.display="block"){ // therefore, for all elements set display to none all[i].style.display = "none"; } La solución es fácil: use un else if en lugar del segundo if . En caso de que solo desee tener los dos estados de visualización "ninguno" y "bloquear", un else es suficiente.
EDITAR: Acabo de notar un segundo error. Debe usar la comparación ( == o === ) en lugar de la asignación ( = ) en sus condiciones if . Así que esto debería estar funcionando:
if(all[i].style.display == "none") { all[i].style.display = "block"; } else { all[i].style.display = "none"; }var last_index = 0; function test() { var e = document.querySelectorAll(".pdfEmbed"); for (var k = 0; k < e.length; k++) { e[k].style.display = k == last_index ? "block" : "none"; } last_index++; if (last_index >= e.length) { last_index = 0; } }