Cuando trato de reproducir un sonido diferente en diferentes botones, no funciona con las instrucciones de cambio. Intenté lo mismo si las declaraciones "if-else" funcionaran. ¿Puede alguien ayudarme con lo que estoy haciendo mal con las declaraciones de cambio?
var numberOfDrumButtons = document.querySelectorAll(".drum").length; for (var i = 0; i < numberOfDrumButtons; i++) { document.querySelectorAll(".drum")[i].addEventListener('click', () => { var buttonInnerHTML = this.innerHTML; switch (buttonInnerHTML) { case "w": var tom1 = new Audio("sounds/tom-1.mp3"); tom1.play(); break; case "a": var tom2 = new Audio('sounds/tom-2.mp3'); tom2.play(); break; case "s": var tom3 = new Audio('sounds/tom-3.mp3'); tom3.play(); break; case "d": var tom3 = new Audio('sounds/tom-4.mp3'); tom4.play(); break; case "j": var snare = new Audio('sounds/snare.mp3'); snare.play(); break; case "k": var crash = new Audio('sounds/crash.mp3'); crash.play(); break; case "l": var kick = new Audio('sounds/kick-bass.mp3'); kick.play(); break; default: console.log('buttonInnerHTML'); } }); }El problema estaba en esta línea.
document.querySelectorAll(".drum")[i].addEventListener('click', () => {
lo resolvió cambiándolo a
document.querySelectorAll(".drum")[i].addEventListener('click', function() {