HTML events are “things” that happen to HTML elements.
An HTML event can be something the browser does, or something a user does.
Here are some examples of HTML events:
- An HTML web page has finished loading
- An HTML input field was changed
- An HTML button was clicked
Often, when events happen, you may want to do something.
With single quotes:
With double quotes:
In the following example, an onclick attribute (with code), is added to a button element:
In the next example, the code changes the content of its own element (using this.innerHTML):
Common HTML Events
Here is a list of some common HTML events:
|onchange||An HTML element has been changed|
|onclick||The user clicks an HTML element|
|onmouseover||The user moves the mouse over an HTML element|
|onmouseout||The user moves the mouse away from an HTML element|
|onkeydown||The user pushes a keyboard key|
|onload||The browser has finished loading the page|
Event handlers can be used to handle, and verify, user input, user actions, and browser actions:
- Things that should be done every time a page loads
- Things that should be done when the page is closed
- Action that should be performed when a user clicks a button
- Content that should be verified when a user inputs data
- And more …
- You can assign your own event handler functions to HTML elements
- You can prevent events from being sent or being handled
- And more …
You will learn a lot more about events and event handlers in the HTML DOM chapters.