Me supondré que aún no conoces sobre los listener
, así que te explicaré de una forma sencilla.
Con el onclick
en tu botón, estás indicando que cuando hagamos clic en el botón, se ejecutará cierta función. Este onclick
es un evento que ocurre cuando le hagamos clic.
Ahora, existe una forma de poder escuchar estos eventos desde JavaScript sin necesidad de poner onclick
en el botón, sería usar el método addEventListener
.
Como dice la documentación:
addEventListener() Registra un evento a un objeto en específico. El Objeto especifico puede ser un simple elemento en un archivo, el mismo documento , una ventana o un XMLHttpRequest.
Para registrar más de un eventListener, puedes llamar addEventListener() para el mismo elemento pero con diferentes tipos de eventos o parámetros de captura.
En pocas palabras, con addEventListener
podemos escuchar los eventos que ocurre en cierto elemento, y una vez ocurra, se ejecutan dichas instrucciones. Por ejemplo, capturemos a tu botón:
let numero1 = document.getElementById('1'); // capturo el botón
Y a ese botón, podemos escuchar los eventos que ocurra, en este caso, cuando ocurra el click
, y una vez ocurra eso, ejecuta a la función uno
(que es el segundo parámetro del listener):
numero1.addEventListener("click", uno) // escucho el evento "click" en el botón "numero1"
Y con esto, llamas a la función sin necesidad de tener onclick
en tu HTML.
let tipotexto = document.getElementById('cuatro');
let numero1 = document.getElementById('1'); // capturo el botón
numero1.addEventListener("click", uno) // escucho el evento "click" en el botón "numero1"
function uno() {
let tipotexto = document.getElementById('cuatro');
tipotexto.value = numero1.value;
}
<input type="text" name="" class="texto" id="cuatro">
<input type="button" name="" value="1" class="buton" id="1">