事件

点击onclick 移入onmouseover 移出onmouseout 页面加载完成oload 获得焦点 onfocus 失去焦点onblur 值发生改变 onchange 表单提交 onsubmit 窗口尺寸改变 onresize - 什么是事件：一些特定的时间点，包括：状态改变事件，鼠标事件，键盘事件

鼠标事件

• 点击事件 onclick
• 鼠标移入 onmouseover
• 鼠标移出 onmouseout
• 鼠标按下 onmousedown
• 鼠标抬起 onmouseup
• 鼠标移动 onmousemove

状态改变事件

• 页面加载完成事件 onload
• 获取焦点事件 onfocus
• 失去焦点事件 onblur
• value值改变事件 onchange
• 提交事件 onsubmit
• 窗口尺寸改变事件 onresize

键盘事件

• 键盘按下事件 onkeydown
• 键盘抬起事件 onkeyup

事件的绑定

1. 在元素内部通过事件属性添加事件 事件中的this代表的是window对象
2. 通过js代码动态绑定事件 事件中的this代表的是事件源

事件的取消

• 在事件中执行 return false; 则可以取消当前的事件

事件对象event

• event对象中保存着和事件相关的信息
• 鼠标事件可以获得鼠标的坐标 event.clientX/Y
• 键盘事件可以获得键盘的编码 event.keyCode
• 在任何事件中可以通过event得到事件源 event.target event.srcElement
  //解决兼容性问题的写法 获得事件源 var obj = event.target||event.srcElement;
• 事件源获取方式：
  1. 在动态绑定的事件中 this就是事件源
  2. 非动态绑定的事件中可以将事件源传递过去
  3. 通过event对象获取事件源

事件的传递（事件冒泡）

• 如果同一个区域内有过个元素的事件需要响应，响应顺序从最底层开始向上级元素传递，传递过程类似于冒泡，所以称为事件冒泡

代码介绍

1. demo01 省市联动练习
2. demo02 好友分组练习
3. demo03 僵尸练习
4. demo04 鼠标事件
5. demo05 键盘事件
6. demo06 事件传递 冒泡