JS事件2(事件代理)

事件处理程序的本质：事件与相关DOM元素的交互。

事件代理：将多个子元素的DOM操作优为化对父元素的一次DOM操作。

        事件代理机制的必要性

图片发自简书App

举个例子

图片发自简书App

我想在上述页面中实现：

点击li1，li1的事件被触发；

点击li2，li2的事件被触发；

..........

..........

传统做法是，为4个li元素各自设置一个.onclick()，那么页面中就会增加4次对DOM的操作。

如果釆用事件代理机制的话

图片发自简书App

如图，我们只对父元素进行了一次DOM操作，就取得了相同的效果。

打个比方。

战争还在继续，我党遭受重创，人员剧减，物资匮乏。为了谍报工作的继续开展，上级规定，一个敌方机构只由一名党员通过一台收音机进行监听。该党员将听到的目标按级别记录下来，依然在晚上开会时向上级汇报。