JavaScript事件(一)

1. Javascript事件流####


事件流是指页面中对象接受事件的顺序,可以分为冒泡事件流和捕获事件流,首先提出冒泡事件流的是微软的IE浏览器,而捕获事件流则是Netscape浏览器应用的事件捕获的解决方案。

1.1 冒泡事件流
冒泡事件流指的是在浏览器中从用户对目标对象触发事件处理程序后,事件最先由目标对象接受然后逐级向上传播;


      
           Event Bubbing Example
      
      
          
Click me

当用户单击页面中的div时,首先div元素捕获到事件,然后向上传播至body->html->document

所有现代浏览器都支持冒泡事件,但是IE5以下会跳过元素,IE9+、firefox、chrome和safari则将事件一直冒泡到window对象。

1.2 事件捕获流
Netscape Communication 团队提出的另一种事件流是事件捕获,事件捕获是指,在目标对象接收到事件之前先由上层元素对象捕获到事件。


      
           Event Bubbing Example
      
      
          
Click me

事件捕获的顺序为document->html->body->div

虽然然事件捕获是Netscape唯一支持的事件流模型,但IE9+等现代浏览器也都支持事件捕获,不过他们都是从window对象开始捕获事件的。

1.3 DOM事件流
“DOM2级事件”规定的事件流包括三个阶段:事件捕获阶段,处于目标阶段和事件冒泡阶段。当用户执行页面交互时首先发生的是事件捕获,之后是处于目标阶段,之后是冒泡阶段。

JavaScript事件(一)_第1张图片
**DOM2事件流模型**

根据上图所示DOM2级事件流模型规定在捕获阶段不会设计事件目标,但是IE9+等现代浏览器都会在捕获阶段触发事件对象上的事件。

2. 事件处理程序####


像click、load、mouseover等为事件,而绑定在事件上的函数就为事件处理程序

2.1 HTML事件处理程序

HTML事件处理程序即是指,直接在HTML代码中指定事件及事件处理函数

    

上面的例子中当点击button时则会弹出cliked


                    
                    

你可能感兴趣的:(JavaScript事件(一))