javascript+HTML交互事件

3、v>事件处理程序（handler）我们也称之为事件侦听器（listener），事件就是用户或浏览器自身执行的某种动作。比如click、load、moseover等，都是事件类型（俗称事件名称），而响应某个事件的方法就叫做事件处理程序或者事件监听器或者事件句柄，事件处理程序名字是：on+事件类型。了解了这些，我们看看如何给元素添加事件处理程序HTML事件处理程序元素支持的每个事件都可以使用一个相应事件处理程序同名的HTML属性指定。这个属性的值应该是可以执行的JavaScript代码，我们可以为一个button添加click事件处理程序复制代码代码如

4、下:在HTML事件处理程序中可以包含要执行的具体动作，也可以调用在页面其它地方定义的脚本,刚才的例子可以写成这样复制代码代码如下:functionshowMessage(){alert('Clicked!');}在HTML中指定事件处理程序书写很方便，但是有两个缺点

5、。首先，存在加载顺序问题，如果事件处理程序在html代码之后加载，用户可能在事件处理程序还未加载完成时就点击按钮之类的触发事件，存在时间差问题。其次，这样书写html代码和JavaScript代码紧密耦合，维护不方便。JavaScript指定事件处理程序通过JavaScript指定事件处理程序就是把一个方法赋值给一个元素的事件处理程序属性。每个元素都有自己的事件处理程序属性，这些属性名称通常为小写，如onclick等，将这些属性的值设置为一个方法，就可以指定事件处理程序，如下复制代码代码如下:

6、ckHere"/>varbtnClick=document.getElementById('btnClick');btnClick.onclick=functionshowMessage(){alert(this.id);};这样处理，事件处理程序被认为是元素的方法，事件处理程序在元素的作用域下运行，this就是当前元素，所以点击button结果是：btnClick这样还有一个好处，我们可以删除事件处理程序，只需把元素的onclick属性赋为null即可DOM2事件处理程序DOM2级事件定义了两个方

7、法用于处理指定和删除事件处理程序的操作：addEventListener和removeEventListener。所有的DOM节点都包含这两个方法，并且它们都接受三个参数：事件类型、事件处理方法、一个布尔值。最后布尔参数如果是true表示在捕获阶段调用事件处理程序，如果是false，则是在事件冒泡阶段处理。刚才的例子我们可以这样写复制代码代码如下: