JavaScript-Events

HTML-events zijn "dingen" die gebeuren met HTML-elementen. Als JavaScript wordt gebruikt in HTML-pagina's, kan JavaScript op deze gebeurtenissen "reageren" .

HTML-events

Een HTML-gebeurtenis kan iets zijn dat de browser doet of iets dat een gebruiker doet. Hier zijn enkele voorbeelden van HTML-gebeurtenissen:

Met JavaScript kunt u code uitvoeren wanneer gebeurtenissen worden gedetecteerd.
In HTML kunnen event handler-attributen gevuld worden met JavaScript-code.

Met enkele aanhalingstekens:
<element event='some JavaScript'>
Met dubbele aanhalingstekens:
<element event="some JavaScript">

In het volgende onclick voorbeeld wordt een attribuut (met code) toegevoegd aan een <button> element:

Voorbeeld
<button onclick="document.getElementById('demo').innerHTML = Date()">The time is?</button>
In het bovenstaande voorbeeld verandert de JavaScript-code de inhoud van het element met id = "demo".

In het volgende voorbeeld verandert de code de inhoud van zijn eigen element (met this.innerHTML):

Voorbeeld
<button onclick="this.innerHTML = Date()">The time is?</button>
JavaScript-code is vaak meerdere regels lang, daarom is het gebruikelijk om een functie aan te roepen bij een event:

Voorbeeld
<button onclick="displayDate()">The time is?</button>

Veel voorkomende HTML-events

Hier is een lijst met enkele veelvoorkomende HTML-gebeurtenissen:

Evenement     Omschrijving
onchange     Een HTML-element is gewijzigd
onclick     De gebruiker klikt op een HTML-element
onmouseover     De gebruiker beweegt de muis over een HTML-element
onmouseout De gebruiker beweegt de muis weg van een HTML-element
onkeydown     De gebruiker drukt op een toets
onload     De browser is klaar met het laden van de pagina

De lijst is veel langer: W3Schools JavaScript Reference HTML DOM Events.

Wat kan JavaScript doen?

Event handlers kunnen worden gebruikt om gebruikersinvoer, gebruikersacties en browseracties af te handelen en te verifiëren:

Er kunnen verschillende methoden worden gebruikt om JavaScript met gebeurtenissen te laten werken: