Genoemde gebeurtenisafhandelaars in JavaScript

In eerdere lessen gebruikten we anonieme functies als gebeurtenisafhandelaars. Dit is eigenlijk niet verplicht - de functie kan ook een gewone, met een naam zijn. Stel dat we bijvoorbeeld de volgende functie hebben:

function func() {
	console.log('!!!');
}

Stel dat er ook een knop is:

<input id="button" type="submit">

Laten we ervoor zorgen dat bij een klik op de knop onze functie func wordt uitgevoerd. Om dit te doen, geven we de naam van onze functie door als parameter van addEventListener, zoals hier:

let button = document.querySelector('#button');
button.addEventListener('click', func);

function func() {
	console.log('!!!');
}

Gegeven de volgende HTML code:

<input id="button1" type="submit" value="button1">
<input id="button2" type="submit" value="button2">

Gegeven de volgende functies:

function func1() {
	console.log(1);
}

function func2() {
	console.log(2);
}

Zorg ervoor dat bij een klik op de eerste knop functie func1 wordt uitgevoerd, en bij een klik op de tweede - functie func2.