JavaScript event bubbling

The 1.javascript Dom is nested with each other, and when the child element is clicked, the event is triggered on the child element, and then the event is passed up the level. This is called event bubbling.

Event.stoppropagation (); You can stop event bubbling, that is, no longer passing events to superiors.

2. Event delegation, because events are passed up and down, so we can delegate functions that would otherwise be executed by child elements to the parent element. The helper child element executes the function after the parent element captures the event to the child element.

Event.target the element that triggered the event

Event.currenttarget the element that currently captures the event

3.jquery handling of Event delegates: delegate (SELECTOR,[TYPE],[DATA],FN)

type: One or more events attached to the element. Multiple event values are separated by a space. Must be a valid event.

Data: Additional data passed to the function

fn: A function that runs when an event occurs

Overview:

The specified element (which belongs to the child element of the selected element) adds one or more event handlers and specifies the function to run when these events occur.

Event handlers that use the delegate () method apply to current or future elements, such as new elements created by a script.

3.dom2 level Event function, add Event AddEventListener (type,function,iscatch), remove event RemoveEventListener

Iscatch whether to capture, true: Capture, false: bubbling. event handling mechanism, bubble compatibility is better.

JavaScript event bubbling