事件的概念
事件:指的是文档或者浏览器窗口中发生的一些特定交互瞬间。我们可以通过侦听器(或者处理程序)来预定事件,以便事件发生的时候执行相应的代码。
一、事件流
- 事件流:描述的是在页面中接受事件的顺序
- 事件冒泡:由最具体的元素接收,然后逐级向上传播至最不具体的元素的节点(文档)
- 事件捕获:最不具体的节点先接收事件,而最具体的节点应该最后接收事件
- 先捕获后冒泡假如我们点击一个div,实际上是先点击document,然后点击事件传递到div,而且并不会在这个div就停下,div有子元素就还会向下传递,最后又会冒泡传递回document
- 兼容触发DOM上的某个事件时,会产生一个事件对象event 只有在事件处理程序执行期间,event对象才会存在,一旦事件处理程序执行完毕,event对象就会被销毁
二、事件处理
HTML事件处理:直接添加到HTML结构中
DOM0级事件处理:把一个函数赋值给一个事件处理程序属性,以这种方式添加的事件处理程序会在事件流的冒泡阶段被处理
//DOM0的事件,对于同一个dom节点而言,只能注册一个,后边注册的 同种事件 会覆盖之前注册的
var btn5 = document.getElementById('btn5');
btn5.onclick=function(){
console.log(this.id);//btn5
};
DOM2级事件处理:
addEventListener("事件名","事件处理函数",布尔值)
false时表示在事件冒泡阶段调用事件处理程序,一般建议在冒泡阶段使用,特殊情况才在捕获阶段;
true:事件捕获
false:事件冒泡
removeEventListener();