了解事件

了解事件
+ 我们提前和浏览器约定好一些行为
+ 当用户在浏览器触发这些行为的时候, 有一个事件处理函数执行

事件三要素
1. 事件源: 在谁的身上绑定事件
2. 事件类型: 什么事件
3. 事件处理函数: 当行为发生的时候, 执行哪一个函数
+ div.onclick = function () {}
+ div: 事件源(绑定在 div 身上的事件)
+ click: 事件类型
+ function () {}: 事件处理函数, 当行为发生的时候, 执行这个函数

事件绑定分类
1. dom0级 事件
+ on... 的形式
2. dom2级 事件
+ 事件监听

事件的绑定
1. dom0级 事件
+ 事件源.onclick = function () {}

2. dom2级 事件
2-1. addEventListener()
=> 标准浏览器使用
=> 语法: 事件源.addEventListener('事件类型', 事件处理函数)
=> 可以同时给一个事件类型绑定多个事件处理函数
=> 多个事件处理函数的时候, 顺序绑定顺序执行
=> 至少两个参数
2-2. attachEvent()
=> IE 低版本使用
=> 语法: 事件源.attachEvent('on事件类型', 事件处理函数)
=> 可以同时给一个事件类型绑定多个事件处理函数
=> 多个事件处理函数的时候, 顺序绑定倒叙执行
=> 只有两个参数

事件的解绑

复杂数据类型的比较
+ 复杂数据类型在比较的时候, 进行地址的比较
+ 复杂数据类型的变量存储的就是一个在 堆 里面的地址

1. 解绑 dom0级 事件
=> 因为时赋值的行为
=> 所以直接再次给他赋值为 null
=> 就把之前的事件处理函数干掉了
2. 解绑 dom2级 事件
2-1. removeEventListener('事件类型', 要解绑的事件处理函数)
=> 注意: 如果你想解绑事件, 那么在你绑定事件的时候, 一定要把函数单独书写
写成一个具名函数的形式, 以函数名的形式绑定事件处理函数
2-2. detachEvent('on事件类型', 要解绑的事件处理函数)
=> 注意: 如果你想解绑事件, 那么在你绑定事件的时候, 一定要把函数单独书写
写成一个具名函数的形式, 以函数名的形式绑定事件处理函数