1.根据DOM树可知，出现在html中的标签在被浏览器解析时都会被挂在dom树上

2.dom树上每个标签都是独立的，都有自己的属性和方法，方法也和dom的事件是挂钩的，通常会在标签上注册一个事件，当事件满足条件被触发以后，就会执行我们预定义好的方法

3.事件就是：让html在某些特定条件下执行了一段js脚本，特定事件如：点击，鼠标经过，键盘输入等，这些条件以属性的形式呈现在html代码中，而触发执行的js脚本则称为方法：如

<div onclick = "fn()"></div>
<script>
    function fn(){
        alert("我被点击了");
    }
</script>

onclick为某些条件的事件句柄，fn为事件满足后要执行的函数，事件分为以下几种写法：原始写法（和html混合在一起），dom0级，dom2级

原始写法：和html混合在一起，缺点代码高冗余，无法添加多个事件处理函数。

dom0级：将html代码和js代码分离，且支持匿名函数，可以看到完美的改进了1的冗余缺憾，所有的事件相关操作都在js中完成

//html代码
<div id="a"></div>

//js代码
var div1 = document.getElementById("a");
a.onclick=function(){
   alert("我被单击了");
}

dom2级：ie使用attachEventListener其他非ie使用addEventListener，支持绑定多个事件。

//html代码
 <div id="one">one</div>

//js代码
  one.addEventListener('click',function fn1(){
    console.log('1')
    })
  one.addEventListener('click',function fn2(){
    console.log('2')
    })
//输出 1  2（因为one拥有一个队列，采用先进先出，先输出1后输出2）


使用removeEventListener可以出队
    one.removeEventListener('click',fn2)
    //这时只输出1