DOM Event Model and JavaScript
  Duration: 12:24
Part of Course: Intermediate D3 Course
This Lesson is for subscribers

Dom-event-model-and-javascript_280x158
Unlock this lesson NOW!
  • Get expert advice on DOM Event Model and JavaScript
  • Enjoy access to the complete DashingD3js catalog
  • Start mastering D3.js right now!

Takeaways:

  • DOM (Document Object Model) Events have two main goals: a) event system for event listeners/handlers and event flow description and b) common subset of event systems for browsers
  • DOM Event Drivers include: mouse events, touch events, keyboard events, HTML frame/object events, HTML form events, User Interface events, and many more
  • The DOM Event Flow is set of steps taken for an Event to traverse the DOM tree from the top of the document to the exact DOM node that was interacted with
  • There are three phases to the DOM Event Flow: Capture Phase, Target Phase, and Bubble Phase
  • The DOM Event Flow Capture Phase describes the travel the event takes from the top of the DOM tree to the DOM node that was interacted with
  • The DOM Event Flow Target Phase describes the event reaching the DOM node that was interacted with
  • The DOM Event Flow Bubble Phase describes the travel the event takes from the DOM node that was interacted with back to the top of the DOM tree
  • Capture Phase event listeners are executed before Target Phase event listeners which are executed before Bubbling Phase event listeners

This Transcript is for subscribers.

Dom-event-model-and-javascript_280x158
Unlock this D3 Tutorial NOW!
  • Get expert advice on DOM Event Model and JavaScript
  • Enjoy access to the complete DashingD3js catalog
  • Start mastering D3.js right now!
<< Back To D3 Screencast and Written Tutorials Index