Front end Week 2:

Chapter 15: Handling Events

Event Handlers Event handlers zijn gebeurtenissen (events) die plaatsvinden in de browser. Dit wordt aan de code doorgegeven wanneer zich een gebeurtenis voordoet. Door handlers te maken voor deze specifieke gebeurtenissen (handelingen van gebruikers) kan de browser ze herkennen.

<p>Click this document to activate the handler.</p>

<script>

window.addEventListener("click", () => {

``console.log("You knocked?");``

});

</script>

window vertegenwoordigt het object waar de gebruiker de handeling uitvoert. In dit geval staat window voor het hele venster van het document.

Events and DOM nodes

<button>Click me</button>

<p>No handler here.</p>

<script>

let button = document.querySelector("button");

button.addEventListener("click", () => {

`console.log("Button clicked.");`

});

</script>

Een handler wordt gelinkt aan de button (een object), en de addEventListener roept de eerste eventhandler (handeling) aan en linkt deze aan de button. Dus als iemand de klikt op de button wordt deze eventhandler geactiveerd en dus herkent.