思维导图
用思维导图，结构化记录本书的核心观点。
1 为元素绑定事件和解绑事件
1.1 使用 元素对象.事件名=事件函数；
（1）为元素绑定事件
使用此方法单个元素只能绑定单个事件
案例：
objBtn.onclick = function (){
alert("绑定事件");
}
（2）为元素解绑事件
// 解绑方式1
objBtn.onclick = null;
1.2 使用 元素对象.addEventListener();
（1）为元素绑定事件
使用此方法单个元素可以绑定多个事件
案例：
objBtn.addEventListener("click", eventFunction1,false);
function eventFunction1(){
console.log("绑定函数1");
}
（2）为元素解绑事件
// 解绑eventFunction2事件
objBtn2.onclick = function (){
objBtn.removeEventListener("click", eventFunction2,false);
}
综合案例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>为元素绑定事件</title>
</head>
<body>
<input type="button" id="btn1" value="绑定事件按钮">
<input type="button" id="btn2" value="解绑事件按钮">
<script>
var objBtn = document.getElementById("btn1");
var objBtn2 = document.getElementById("btn2");
// 绑定函数有三个参数
/*
参数1：事件类型[事件名字]
参数2：事件处理函数
参数3：布尔类型（暂时用FALSE）
*/
objBtn.addEventListener("click", eventFunction1,false);
objBtn.addEventListener("click", eventFunction2,false);
objBtn.addEventListener("click", eventFunction3,false);
// 解绑eventFunction2事件
objBtn2.onclick = function (){
objBtn.removeEventListener("click", eventFunction2,false);
}
objBtn.onclick = function (){
alert("绑定事件");
}
// 解绑事件1
objBtn.onclick = null;
// 事件函数
function eventFunction1(){
console.log("绑定函数1");
}
function eventFunction2(){
console.log("绑定函数2");
}
function eventFunction3(){
console.log("绑定函数3");
}
</script>
</body>
</html>
