JavaScript 的事件机制以及事件代理

背景：

这次的任务如上图所示，给出的方法就是最常见的操作dom然后获取nodeList数组，通过对数组进行一一访问来操作。
接下来的要求是：

使用事件代理来完成上面的要求。
百度前端学院给到的教程：https://www.cnblogs.com/liugang-vip/p/5616484.html
我觉得已经很详细了。说一下我的大概理解吧。
所谓事件代理，简单的来说就是为了减少DOM操作节省内存，采用的一种模式。它的原理是：利用事件冒泡，只指定一个事件处理程序，就可以管理某一类型的所有事件。教程中的收快递例子可以帮我们理解这一模式。一般是给父级元素添加事件就好了，其他的都是在js里面的执行。
为了方便我们处理，让事件代理的效果跟直接给节点的事件效果一样，Event对象提供了一个属性叫target（target的意思是靶子，目标，对象），可以返回事件的目标节点，我们成为事件源，也就是说，target就可以表示为当前的事件操作的dom，但是不是真正操作dom，当然，这个是有兼容性的，标准浏览器用ev.target，IE浏览器用event.srcElement
我们把这个target打印出来



最后总结：适合用事件委托的事件：click，mousedown，mouseup，keydown，keyup，keypress。

值得注意的是，mouseover和mouseout虽然也有事件冒泡，但是处理它们的时候需要特别的注意，因为需要经常计算它们的位置，处理起来不太容易。

不适合的就有很多了，举个例子，mousemove，每次都要计算它的位置，非常不好把控，在不如说focus，blur之类的，本身就没用冒泡的特性，自然就不能用事件委托了