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

diferença entre (button.onclick) e (botaoAdicionar.addEventListener)

Olá,

Os dois códigos são similares?

function verifica() {
    ...
}
button.onclick = verifica;
button.addEventListener("click", function(event){
    ...
}
2 respostas

Oi Flávio, tudo bem ?

Esses códigos são os mesmos sim !

O resultado é o mesmo, você pode usar ambos para chegar nesse resultado.

Abraços

solução!

Olá Flávio,

A única diferença que eu conheço entre essas funções, é que uma adiciona os eventos várias vezes no elemento (faz um append das funções), e a outra sobreescreve os eventos já existentes.

Veja o exemplo

<button id="onclick">onclick</button>
<button id="addEventListener">addEventListener</button>
var example1 = document.querySelector('#onclick'),
    example2 = document.querySelector('#addEventListener');


example1.onclick = function() {
  alert('onclick event #0');
};

example1.onclick = function() {
  alert('onclick event #1');
};

example2.addEventListener('click', function() {
  alert('onclick event #0');
});

example2.addEventListener('click', function() {
  alert('onclick event #1');
});

Veja que ao clicar no example1 é exibido a última função que nós adicionamos no elemento que no caso é alert('onclick event #1'); já no example2 ambas as funções são executadas na sequência em que foram adicionadas.

Vale ressaltar também que onclick é um evento mais aceito entre os navegadores antigos, já quando usar addEventListener você vai precisar verificar para quais navegadores irá dar suporte.

Att.