- Events allow executing code when something happens on a page
- Common HTML events:
- click
- submit
- change
- keydown
- scroll
- load
- Adding event listeners:
element.addEventListener(event, function) - Callback functions run when event occurs
- Accessing event object properties:
- target
- type
- timestamp
- keyCode etc
- Examples:
button.addEventListener('click', function(){ //do something });
input.addEventListener('keydown', function(event){ if(event.keyCode === 13){ //run code on enter } }); - Event bubbling/propagation
- Removing event listeners
- Differences between HTML and DOM events
- Listener syntaxes: onclick, addEventListener
- Tips for efficient event handling