JQuery event delegate instance analysis and jquery delegate instance analysis

JQuery event delegate instance analysis and jquery delegate instance analysis

Event delegation is mainly implemented by event bubbling. precise understanding of event delegation can help improve code execution efficiency. Let's take a look at a code example:

<! DOCTYPE html> 
In the above Code, the bind () method is used to bind a click event handler function for each td, so that when you click a cell, the text in the cell will be reset. Although this method achieves the desired effect and looks perfect, it is not. If there are many cells, traversing a cell and binding an event handler for each cell will greatly reduce the code performance. If the parent element of a cell listens to an event, you only need to determine whether the DOM element of the initial event is td.
The code is modified as follows:
<! DOCTYPE html> 
The above code implements the same functions, but the efficiency is greatly improved.
Conclusion: The event Delegate means that the event target does not process the event itself, but delegates the processing task to its parent element, ancestor element, or even root element.
The above is all the content of this article. I hope you will like it.