<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div id="box">点我</div>
<script>
var box=document.getElementById('box');
//DOM0级事件绑定
//给同一个元素的同一个事件行为绑定不同的函数,后面绑定的方法会覆前面的方法
// box.onclick=function () {
// console.log(1);
// }
// box.onclick=function(){
// console.log(2);
// }
//DOM2级绑定不能给同一个元素的同一个事件行为绑定同一个方法
// function fn(){
// console.log(3);
// }
// box.addEventListener('click',fn,false);
// box.addEventListener('click',fn,false);
//DOM级事件绑定可以给同一个元素的同一个事件行为绑定多个方法,谁先绑定谁先执行
// function fn1(){
// console.log(4);
// }
// function fn2(){
// console.log(5);
// }
// box.addEventListener('click',fn1,false);
// box.addEventListener('click',fn2,false);
function fn(){
console.log(6);
console.log(this);//这里面的this指向window
}
box.attachEvent('onclick',fn);
box.attachEvent('onclick',fn);
// 1. 顺序问题； attachEvent绑定的事件方法顺序是倒序的；
// 2. 重复绑定的问题；可以给同一个元素的同一个事件绑定相同的方法；
// 3. 函数方法中的this指向window，不指向绑定的那个元素；
// 元素内置类： HTMLDIVElement-->HTMLElement-->Element-->Node-->EventTarget--->Object
</script>
</body>
</html>
