[Projeto] 04 Faça como eu fiz: Modificando estilos com JavaScript

// imprime na tela o número digitado
function imprimeNumeroDigitado(numero) {
  let campoTelefone = document.querySelector('input[type="tel"]');
  campoTelefone.value += numero;
}

// Lista com todas as teclas
const listaTeclas = document.querySelectorAll('input[type="button"]');

// exemplo de função anonima. (NAO É NECESSARIO DAR NOME)
for (let contador = 0; contador < listaTeclas.length; contador++) {
  // armazena todos os elementos com a iteração do contador
  let tecla = listaTeclas[contador];

  // seleciona o valor contido no elemento
  let valor = tecla.value;
  console.log(valor);

  // template string

  // função anonima (por padrão o js chama automat. a função, por isso é criado essa função anonima para ser executada somente quando tiver o evento
  tecla.onclick = function (e) {
    imprimeNumeroDigitado(valor);
  };

  tecla.onkeydown = function (e) {
    if (e.code === "Enter" || e.code === "Space") {
      tecla.classList.add("ativa");
    }
  };

  tecla.onkeyup = function (e) {
    if (e.code === "Enter" || e.code === "Space") {
      tecla.classList.remove("ativa");
    }
  };
}