event agent
Instead of setting an event listener for each child node individually, set it on its parent node, and then use the bubbling principle to set each child node.
advantage
1. Reduce memory consumption and DOM operations and improve performance. In JavaScript, the number of event handlers added to the page will be directly related to the overall running performance of the page. Because the DOM needs to be continuously manipulated, the more likely it is to cause the browser to redraw and reflow, and the page interaction events will also be The longer it becomes, which is why it is necessary to reduce dom operations. Each event processing function is an object. If there is one more event processing function, more space will be occupied in the memory. If you want to use event delegation, you will put all operations into the js program, only operate on its parent, and only need to interact with the dom once. This can greatly reduce the number of interactions with the dom and improve performance;
2. Dynamically bound events. Because the event is bound to the parent element, newly added child elements can also trigger the same event.