Realmente sua solução ficou muito boa, mas se eu pudesse sugerir algum ponto de melhoria eu diria para retirar os comandos relacionados com a variável ligar
de dentro do for
.
Como o ligar
é um elemento único na tela, não há necessidade de ficar "buscando" e adicionando uma função de onclick
para ele toda vez. (Para ficar mais claro o que eu disse, adicione um console.log('Botão ligar apertado');
dentro da função onclick
do ligar
e veja quantas mensagens vão aparecer).
Abaixo deixei um exemplo com a melhoria que comentei, e aproveitei para renomear as variáveis do jeito que eu faria XD. (mas obviamente não precisa fazer isso também).
const textoDigitado = document.querySelector("input[type=tel]");
const ligar = document.querySelector("input[type=submit]");
ligar.onclick = function () {
textoDigitado.value = "";
};
const teclado = document.querySelectorAll("input[type=button]");
for (i = 0; i < teclado.length; i++) {
const tecla = teclado[i];
tecla.onclick = function () {
// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Addition_assignment
textoDigitado.value += tecla.value;
};
}