源码：
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<button>赋诗</button>
<script>
var btn = document.getElementsByTagName("button")[0];
// btn.addEventListener("click",fn1);
// btn.addEventListener("click",fn2);
fn("click",fn1,btn);
fn("click",fn2,btn);
fn("click",fn3,btn);
function fn1(){
console.log("1");
}
function fn2(){
console.log("2");
}
function fn3(){
console.log("3");
}
//原理（了解）（自己封装一个）(click)
function fn(str,fn,ele){
//判断位置要注意：如果进入绑定事件本身，那么该事件已经本绑定了
//所以获取旧的事件必须在新的事件绑定之前
var oldEvent = ele["on"+str];
console.log(oldEvent)
// console.log(oldEvent)
ele["on"+str] = function () {
//不能直接执行函数，因为我们还不知道以前有没有绑定我同样的事件
//进行判断，如果以前有过绑定事件，那么把以前的执行完毕在执行现在的事件，如果没有就直接执行
//如果没有被定义过事件该事件源的该事件属性应该是null对应的boolean值是false
//如果已经定义过事件该事件源的该事件属性应该是function本身对应的boolean值是true
if(oldEvent){
//因为oldEvent本身他就是函数本身，那么后面加一个();就是执行函数
oldEvent();
fn();
}else{
//没有绑定过事件
fn();
}
}
}
</script>
</body>
</html>
网友评论