转行学开发，代码100天——2018-03-19
1、Event 对象
Event 对象代表事件的状态，比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。
事件通常与函数结合使用，函数不会在事件发生前被执行！
2、常用的event属性有：
type //返回当前 Event 对象表示的事件的名称。
target //返回触发此事件的元素（事件的目标节点）
3、常用的event方法有：
initEvent() //初始化新创建的 Event 对象的属性
stopPropagation() //通知浏览器不要执行与事件关联的默认动作。即阻止事件冒泡
preventDefault() //不再派发事件。即阻止默认事件
<!DOCTYPE html> <html> <head> <title>事件流</title> </head> <body> <div id="div"> <button id="btn">按钮</button> <a href="http://www.baidu.com" id="aid">百度</a> </div> <script type="text/javascript"> document.getElementById("btn").addEventListener("click",showType); document.getElementById("div").addEventListener("click",showDiv); document.getElementById("aid").addEventListener("click",showA); function showType(event) { alert(event.bubbles);//事件为冒泡事件，返回值为true alert(event.type); //返回类型为click alert(event.target); //返回[object HTMLButtonElement] event.stopPropagation();//阻止事件冒泡 } function showDiv() { alert("div"); } function showA(event) { event.stopPropagation();//阻止冒泡事件 event.preventDefault(); //阻止a标签默认行为，即点击a标签时，不会跳转到相应网址 } </script> </body> </html>
注意：事件传播
在 2 级 DOM 中，事件传播分为三个阶段：
第一阶段捕获阶段。事件从 Document 对象沿着文档树向下传递给目标节点。如果目标的任何一个先辈专门注册了捕获事件句柄，那么在事件传播过程中运行这些句柄。
第二个阶段发生在目标节点自身。直接注册在目标上的适合的事件句柄将运行。这与 0 级事件模型提供的事件处理方法相似。
第三阶段起泡阶段。在此阶段，事件将从目标元素向上传播回或起泡回 Document 对象的文档层次。