Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Console notifica TypeError na linha 11 do meu código, não entendo porque

function tocaSom(idElementAudio) {
    document.querySelector(idElementAudio).play();
}

const listaDeTeclas = document.querySelectorAll('.tecla');


for (let contador = 0; listaDeTeclas.length; contador++) {

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

    tecla.onclick = function () {
        tocaSom(idAudio);
    }

    tecla.onkeydown= function () {
        tecla.classList.add('ativa');
    }
}

Linha 11: const instrumento = tecla.classList[1];Capitura de tela com o erro no Index

2 respostas
solução!

Olá Isabella,

A segunda condição do seu for está verificando apenas o comprimento da lista com isso o loop ultrapassar o tamanho da lista e acaba dando lancando uma exceção, pois o valor do objeto tecla, na linha 10, será undefined onde não existe a propriedade classList..

Para corrigir o problema, altere a 2ª condição do for na linha 4 de listaDeTeclas.length para contador < listaDeTeclas.length:

Segue o código completo:

function tocaSom(idElementAudio) {
    document.querySelector(idElementAudio).play();
}

const listaDeTeclas = document.querySelectorAll('.tecla');


for (let contador = 0; contador < listaDeTeclas.length; contador++) {

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

    tecla.onclick = function () {
        tocaSom(idAudio);
    }

    tecla.onkeydown= function () {
        tecla.classList.add('ativa');
    }
}

Muito obrigada!