DOM:
- 一、正确的事件委托
错误的写法:
ul.addEventListener('click', function (e) {
if (e.target.tagName.toLowerCase() === 'li') {
console.log('...');
}
})
这么写的原因是假如想要点击的是li就执行回调,但是li里面嵌套了其他标签如span。此时就需要用while循环一直到找不到指定的节点再跳出循环。
function enTrust (element, eventType, selector, fn) {
element.addEventListener(eventType, e => {
let el = e.target;
while (!el.matches(selector)) {
if (element == el) {
el = null;
break;
}
el = el.parentNode;
}
el && fn.call(el);
});
return element;
}