Events are actions taken by the user, not things that are executed on pageload. For example:
- clicking on something
- hovering over a link
- dragging and dropping
- pressing keys
In other words, events add interactivity. The way that this works roughly is that we select an element and then add an event listener.
Here is a quick sample where we just create a console log when a button is clicked:
Here is another example where we change the content of a paragraph when a button is clicked:
You do not have to use an anonymous() function, you can also create a named function like this:
Common event include the following:
There are over 200 recognized events. A full list of events is available on MDN Docs.