1
resposta

Está dando null no meu play()

function TocaSom (idElementoAudio){
    document.querySelector(idElementoAudio).play()

}
const ListaDeTeclas =document.querySelectorAll('.tecla')

var contador = 0;

while (contador < ListaDeTeclas.length){

    const tecla=ListaDeTeclas[contador];
    const instrumento = tecla.classList[1];
    const idAudio=` #som _${instrumento} `; //template string

    console.log(idAudio);

    tecla.onclick= function () {
        TocaSom (idAudio);

}
    contador=contador + 1 ;                               

    console.log(contador);
}
1 resposta

Oi Felipe, tudo bem com você?

Primeiro queria te avisar que fiz uma pequena edição no seu tópico para melhorar a visualização do seu bloco de código. Caso você queira saber como eu fiz, para que possa formatar seus próximos posts aqui no fórum, basta seguir o seguinte passo a passo:

  • Selecione e copie o código que será compartilhado no fórum.
  • Abra a postagem do fórum que será enviada o código.
  • Nas ferramentas do campo O que você acha disso? clique na sétima ferramenta de nome Inserir bloco de código ou pressione ctrl + alt + c.
  • Cole o código que será enviado
  • Clique em Responder.

Início da transcrição. Gif, nesse gif o usuário inicia com o painel de codificação do Pycharm, seleciona o código presente neste painel, clica com o botão direito no código selecionado, logo após clicar em copy, logo após abre a página do fórum alura no campo “o que você acha disso?” Ao final da página, clica no botão Inserir bloco de código, sétimo da esquerda para a direita, nesse momento é inserido 6 crases o usuário cola o código entre elas. Final da transcrição

Agora sim, respondendo sua questão, o .play está resultando em null pois na declaração do id_audio você deixou um espaço entre "som" e "_${instrumento}" , da seguinte maneira:

   const idAudio=` #som _${instrumento} `; //template string

Poratanto, sua função tocaSom() não está conseguindo encontrar o elemento do qual você quer reproduzir som, então a função .play() não sabe o que deve tocar, retornando null. Para solucionar, basta apagar o espaço, assim:

   const idAudio=` #som_${instrumento} `; //template string

Espero ter esclarecido sua dúvida!

Um abraço e bons estudos!

Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!