En primer lugar, soy principiante en programación. Tengo una pregunta sobre JavaScript DOM. Me gustaría verificar si una etiqueta o nodo tiene un estilo backgroundColor para poder ejecutar el resto del código, también intenté poner la propiedad .clicked pero no funciona. Aquí está mi código:
let btn1 = document.getElementById("0"); let btn2 = document.getElementById("1"); btn1.addEventListener("click", function() { btn1.style.backgroundColor = 'red'; btn2.style.backgroundColor = 'green'; }); if (btn1.style.background == 'red' || span2.style.backgroundColor == 'red') { console.log("test"); // doesn't work !! }Es porque su declaración if solo se ejecuta una vez. Envuélvalo dentro de una función y llame a esa función después de cada clic:
let span1 = document.getElementById("0").getElementsByTagName("span")[1]; let span2 = document.getElementById("0").getElementsByTagName("span")[2]; span1.addEventListener("click", function () { span1.style.backgroundColor = "gray"; span2.style.backgroundColor = "#eee"; checkColor(); }); span2.addEventListener("click", function () { span2.style.backgroundColor = "gray"; span1.style.backgroundColor = "#eee"; checkColor(); }); function checkColor() { if ( span1.style.backgroundColor == "gray" || span2.style.backgroundColor == "gray" ) { console.log("test"); // doesn't work !! } } <ul id="questions"> <li id="0"> <span>Do you like JavaScript?</span> <span>Yes</span><span>No</span><span class="result"></span> </li> <li id="1"> <span>JavaScript and Java are the same</span> <span>Yes</span><span>No</span ><span class="result"></span> </li> <li id="2"> <span>JavaScript is easy to learn</span> <span>Yes</span><span>No</span><span class="result"></span> </li> </ul>Nota: este fragmento solo incluye los dos primeros tramos.