Dynamic HTML: The Definitive Reference

Event Propagation

In some DHTML applications, it is not always efficient to have target elements process events. For example, if you have a page that allows users to select and drag elements around the page, it is quite possible that one centralized function can handle that operation for all elements. Rather than define event handlers for all of those elements, it is better to have the mouse-related events go directly to an object or element that has scope over all the draggable elements. In other words, one event handler can do the job of a dozen. For this kind of treatment to work, events must be able to propagate through the hierarchy of objects or elements in the document. Version 4 browsers are the first to incorporate event propagation in their event models.

The differences in the event models between Navigator 4 and Internet Explorer 4 are most evident in the way that an event passes through the document hierarchy after it fires. Events literally travel in opposite directions in the two browsers: Navigator 4 events trickle down through the object hierarchy to the intended target object, while IE 4 events bubble up from the target element through the element containment hierarchy. In addition, Navigator 4 objects don’t intercept events as they trickle down unless they are explicitly instructed to do so, while IE 4 events automatically bubble up unless explicitly stopped by any element along the bubble path.

Navigator 4 Event Propagation

When a user initiates an action ...