DOM - Event
Table of Contents
1 - About
UI - Action (Interaction | Event ) in the dom.
Event are code structures that listen out for things happening to the document.
In the DOM specification, you can find the following:
- The type of an event
- The concept of a regular event parent and a cross-boundary event parent
The callback function that handle the event can be created with the help of:
- An event handler. Its name starts with “on” and is followed by the name of the event for which it is intended. (Example: onClick)
and get back an event object
2 - Articles Related
3 - Features
The following features are defined in the DOM Events specification:
- MouseEvent interface
- MouseEventInit dictionary type
- The UIEvent interface's detail attribute
An event's type is synonymous of name type (ie “an event named click” or “if the event name is keypress”)
4 - Example
For example, the following document fragment:
<button class="btn btn-info" onclick="console.log('Bouh!')" >Click Me</button>
5 - Glossary
In the contexts of events, the terms fire and dispatch are used as defined in the DOM specification:
5.1 - Fire
Event - Fire
5.2 - Dispatch
Dispatching an event means to follow the steps that propagate the event through the tree.
5.3 - Trusted
The term trusted event is used to refer to events whose isTrusted attribute is initialized to true
5.4 - Missed
6 - Management
6.1 - List
6.2 - Category
6.3 - See
6.4 - Prevent default
If you don't want to have the default beahavior (such as following a link), you can prevent it with the event.preventDefault() function.
7 - Documentation / Reference
- Document Object Model (DOM) Level 2 Events, T. Pixley. W3C.
- Document Object Model (DOM) Level 3 Events Specification, T. Leithead, J. Rossi, D. Schepers, B. Höhrmann, P. Le Hégaret, T. Pixley. W3C.
- Progress Events, A. van Kesteren, C. McCathie Nevile; J. Song. W3C. An event interface that can be used for measuring progress; e.g. HTTP entity body transfers