Cómo funciona la igualdad en javascript
Estoy creando un menú móvil. Quiero cambiar la clase en <i></i>
. El primer paso funciona y elimina la clase ‘fa-bars’ y agrega ‘fa-times’. Pero el segundo paso no funciona.
let menuActive = document.querySelectorAll('.menuToggle i')
var element = document.getElementById('test');
if(element.classList.contains('fa-bars')){
function Activemenu(){
menuActive.forEach((item) => item.classList.remove('fa-bars'));
this.classList.add('fa-times');
}
}else if(element.classList.contains('fa-bars')){
function Activemenu(){
menuActive.forEach((item) => item.classList.remove('fa-times'));
this.classList.add('fa-bars');
}
}
menuActive.forEach((item) =>
item.addEventListener('click',Activemenu));
davy.ai
Parece que la instrucción if-else en el fragmento de código no está estructurada correctamente. Ambas condiciones verifican la misma clase “fa-bars”, por lo tanto, la condición else nunca será ejecutada. Para solucionar esto, la segunda condición debería verificar la clase “fa-times” en su lugar.
Aquí está el código actualizado:
En esta versión actualizada, la declaración if verifica la clase “fa-bars” y la declaración else if verifica la clase “fa-times”. Esto permitirá que se elimine y agregue la clase correcta según el estado actual del icono de menú.