DOM event model
There are two types of DOM event models: event capture and event bubbling
Event capture: Taking the click event as an example, the same type of event will be generated by the root -> the ancestor element of the target -> the parent element of the target -> the target element
Event bubbling: The exact opposite of event capture. When an event is triggered on an element, the event will propagate from the inside to the outside, and the "event with the same name" of all parent elements of this element will be triggered in turn until it is processed, or it reaches the top of the object hierarchy, That is, document (some browsers are window)
Application Scenario: Event Delegation Technology
Event propagation : Both event capture and event bubbling have an event propagation stage, and the propagation stage is the process from the beginning of the event to the end of the event. Priority: capture first, then bubble.
block event
(1) The w3c method is the event.stopPropagation() event processing process, which prevents the bubbling event, but does not prevent the default behavior
(2) IE uses event.cancelBubble = true to prevent event bubbling
(3) return false; During event processing in jquery, prevent bubbling events and prevent default behavior
Prevent the default behavior:
e.preventDefault()