Así que estaba haciendo un carrusel bastante simple en el que cuando un usuario hace clic en un botón, la imagen o el contenido cambia. Conseguí que funcionara a mitad de camino, pero solo soy un problema. En el código, primero verifico si la visualización de la tarjeta 1 está bloqueada y la visualización de la tarjeta 3 es ninguna. Ahí es donde muestra el problema. En la primera parte está bien, pero después de && cuando escribo card3.style = "display:none" resalta los iguales para firmar y no funciona. Intenté cambiar la orientación del código e incluso agregar == pero fue en vano. ¿Puede alguien ayudarme con esto?

Puedes revisar mi código:

 <div class="card1" id="card1"> </div> <div class="card2" id="card2"> </div> <div class="card3" id="card3"> </div> <button onclick="change()">Change</button>

 .card1{ width: 40%; height: 40%; background-color: blue; } .card2{ width: 40%; height: 40%; background-color: red; display: none; } .card3{ display: none; width: 40%; height: 40%; background-color: green; }

 var card1 = document.getElementById("card1") var card2 = document.getElementById("card2") var card3 = document.getElementById("card3") function change(){ if(card1.style = 'display:block;' && card3.style = 'display:none'){ card1.style = 'display:none'; card2.style = 'display:block'; } }