Question

原生js事件监听有哪些方法，jq又有哪些，jq中这些方法有何区别

Answer 1

一、原生JS事件绑定方法：
1、通过HTML属性进行事件处理函数的绑定如：　

1

＜a href="#" onclick="f()"＞

2、通过JavaScript对象属性进行绑定：

1
2

var a=document.getElementById("a");
a.onclick=function(){alert("你好！")};//这里也可以不用匿名的函数直接赋方法名也是可以的

通过以上这种方式进行事件函数的绑定有个缺点就是只能对一个元素的一个事件绑定一个事件处理程序，如

1
2
3
4
5
6

document.body.onclick=function(){
alert("first.");
};
document.body.onclick=function(){
alert("second.");
};

以上这种方式后面的事件处理程序会将前面的覆盖只会执行alert（"second"）,前面的将不会被执行。
3、利用所有文档元素的方法进行事件绑定：
a、addEventListener(type,handler,boolean),兼容IE8以后的所有浏览器
b、attachEvent（type,handler）适用于IE8及以下版本的浏览器
另种方法可以为JS对象的一个类型事件注册多个事件处理程序，但两者是有区别的：
（1）addEventListener中的type是不带有on的如点击事件直接用"click",而在attachEvent中的type是需要带有前缀on的；（2）前者可以接收三个参数决定事件发生的阶段是在捕获阶段还是冒泡阶段,为true则发生在捕获阶段，如果为false则发生在冒泡阶段；（3）通过addEventListener注册的事件的执行顺序与事件的注册顺序一致，即先注册的先执行，后注册的后执行。而后者执行的顺序与注册的顺序是无关的，因而在写代码时代码的执行不要依赖事件的注册顺序。（4）addEventListener对于相同的事件只会注册一次，即使多次的写了注册函数也只会成功注册一个，而后者可以将将相同的事件处理函数注册多次，并且会多次被执行。
这两种方法通常会被同时应用用于兼容不同版本的浏览器。如：

1
2
3
4
5
6
7

if(ele.addEventListener())
{