function bindEvent(elem, type, selecter, fn) {
if (fn == null) {
// 如果没有传第四个参数那么第四个参数等于第三个参数 ,即 : fn = selecter
fn = selecter
selecter = null
}
elem.addEventListener(type, function (e) {
var target =e.target
if (selecter) { //有selecter相当于使用代理
if (target.matches(selecter)) { //判断是否和你传的selecter相匹配
//改变this指向
fn.call(target, e)
}
} else { //不使用代理
fn.call(target,e)
}
})
}
var div1 =document.querySelector('.div1')
var p1 =document.querySelector('.p1')
//使用代理 第三个参数相当于事件委托的写法
bindEvent(div1, 'click', 'a', function (e) {
e.preventDefault()
//不重要:给当前元素加个类名
e.currentTarget.classList.add('is-active')
console.log(dd);
})
// 不使用代理
bindEvent(p1, 'click', function (e) {
e.preventDefault()
console.log('pp')
})