事件冒泡和事件捕获的区别

事件冒泡和事件捕获这两个概念都是为了解决页面中事件流(事件发生顺序)的问题。

1、事件冒泡

事件冒泡:事件会从最内层的元素开始发生,一直向上传播,直到document对象。

2、事件捕获

事件捕获:与事件冒泡相反,事件会从最外层开始发生,直到最具体的元素。

3、addEventListener方法
element.addEventListener(event, function, useCapture)

第一个参数是需要绑定的事件,第二个参数是触发事件后要执行的函数。而第三个参数默认值是false,表示在事件冒泡的阶段调用事件处理函数,如果参数为true,则表示在事件捕获阶段调用处理函数。

4、事件代理机制

table.addEventListener("click", function(el) {
    //如果触发事件本身的类名==del,那么进行删除操作
    if(el.target.className == "del") {
        el.target.parentNode.parentNode.remove();
    }
})

 

posted @ 2022-09-14 15:16  smil、梵音  阅读(982)  评论(0编辑  收藏  举报