要了解事件冒泡与事件捕获,首先要知道什么是事件流
事件流描述的是从页面中接受事件的顺序,早年根据浏览器的不同,事件流有两种完全相反的概念(IE与Netscape)
1.事件冒泡
IE中的事件流就叫做事件冒泡,即时间开始时由最具体的元素接收,然后逐级向上传播到较为不具体的节点(引用自JavaScript高级程序设计)】
简单来说,假如页面中一个id为div1的div元素绑定了click事件,那么这个click事件会按照以下顺序传播
div->body->html->document
而当body-html都绑定了click事件时,点击div1则会同时逐级触发父级元素绑定的click事件
IE9+、Firefox、Chrome、Safari会将事件一直冒泡到window对象
根据事件冒泡这一特性,可以
2.事件捕获
事件捕获是由Netscape Communicator团队提出的另一种事件流,和事件冒泡刚好相反
仍然以上面的div1为例,事件捕获中的传播顺序就是
document->html->body->div1
也就是说,在事件捕获中,document对象首先接收到click事件,然后顺着DOM树逐级向下,一直到事件的实际目标