EventListener

<button id="btn">Cliquez ici !</button>

<p id="funcOutput"></p>
<p id="handleEvtOutput"></p>

const buttonElement = document.getElementById('btn');
const funcOutput = document.getElementById('funcOutput');
const handleEvtOutput = document.getElementById('handleEvtOutput');

// On ajoute un gestionnaire pour l'évènement 'click' en fournissant
// une fonction de rappel (callback).
// Lorsqu'on clique sur l'élément, la sortie "Élément cliqué avec une fonction !"
// apparaîtra dans le paragraphe avec l'identifiant "funcOut".
buttonElement.addEventListener('click', function (event) {
  funcOutput.textContent = 'Élément cliqué avec une fonction !';
});

// À des fins de compatibilité, un objet qui n'est pas une fonction
// mais qui possède une propriété `handleEvent` sera traité comme si
// cette propriété avait été passée comme argument fonctionnel.
// La sortie "Élément cliqué via la propriété handleEvent !"
// apparaîtra simultanément dans le paragraphe avec l'identifiant
// "handleEvtOutput".
buttonElement.addEventListener('click', {
  handleEvent: function (event) {
    handleEvtOutput.textContent = 'Élément cliqué via la propriété handleEvent !';
  }
});