JS 事件委托

用JQ用多了,来回顾一下原生JS的事件委托怎么写

HTML

 list 内容是 ajax动态传入的,所以点击事件 就委托到.list上

JS

var list = document.getElementsByClassName('list')[0];
    function navItemFn(v) {
        for (var item of navItem) {
            item.classList.remove('on')
        }
        v.classList.add('on')
    }
    
    list.onclick=(ev)=>{
        var ev =ev || window.event;
        var target=ev.target || ev.srcElement;
        
        alert(target.parentNode.parentNode.getAttribute('data-href'))
        ev.stopPropagation();
    }
View Code
target 是点击的当前元素,子元素(孙子元素),如果绑定的内容,在父元素上,需要一层一层去寻找
原文地址:https://www.cnblogs.com/GoTing/p/13531215.html