Please enable JavaScript.
Coggle requires JavaScript to display documents.
DOM Events - Coggle Diagram
DOM Events
Event concepts
Delegation
Using event bubbling and event.target we can avoid adding multiple elements for children. Instead we can add one event on parent which will be fired due to event bubbling. We can find out the origin of the event using event.target property.
-
Phases
-
Bubble
By default all event listeners are registered for bubble phase in all modern browsers. To set an event in bubble phase with addEventListener, pass 3rd parameter as one of following
- useCapture: false
- {capture: false}
Capture
There are 2 ways to register event in capture phase using addEvnetListener. Passing 3rd parameter as one of following
- useCapture: true
- {capture: true}
Event Registration
-
-
addEventListener((type, calback, options|useCapture)
type: type of event such as 'click', 'mouseup' etc
callback: a function which receives event object and performs something related to the action
options: a configuration object giving extra control over how events are processed.
-
Common Events
Mouse
Keyboard
Input
-
-
Form
Document
Drag and Drop
Clipboard
Async Data fetching
- 1 more item...
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-