onclick和addeventlistener的区别（js有关addEventListener的问题）
本文目录
- js有关addEventListener的问题
- JS addEventListener(“click“)这里的click为什么不加on
- addEventListener和onclick的区别
- addEventListener和普通.onclick的区别
- addEventListener和attachEvent以及element.onclick的区别
js有关addEventListener的问题
直接onclick 这个事件会被覆盖。
addEventListener 这个是事件绑定，事件内容不会被覆盖。
button.onclick = function(){alert(1)};
button.onclick = function(){alert(2)};
button.addEventListener(“click“,function(){alert(“xx“),false});
button.addEventListener(“click“,function(){alert(“yy“),false});
执行一下，就知道结果了。
JS addEventListener(“click“)这里的click为什么不加on
onclick是绑定事件，告诉浏览器在鼠标点击时候要做什么
2.click本身是方法,作用是触发onclick事件，只要执行了元素的click()方法，就会触发onclick事件
3.添加EventListener，传的参数是事件的名称，例如“click“
以上是click(), onclick(), click的区别
addEventListener和onclick的区别
addEventListener是在 FireFox 上的用法。
addEventListener的参数一共有三个，语法为：
element.addEventListener(type,listener,useCapture)
详解
其中element是要绑定函数的对象。
type是事件名称，要注意的是“onclick“要改为“click“,“onblur“要改为“blur“,也就是说事件名不要带“on“。
listener当然就是绑定的函数了，记住不要跟括号
最后一个参数是个布尔值，表示该事件的响应顺序,下面重点介绍一下addEventListener的第3个参数(useCapture)。
userCapture若为true,则浏览器采用Capture,若为false则采用bubbing方式。建议用false
区别：《pre t=“code“ l=“java“》var btn1Obj = document.getElementById(“btn1“);
//element.addEventListener(type,listener,useCapture);
btn1Obj.addEventListener(“click“,method1,false);
btn1Obj.addEventListener(“click“,method2,false);
btn1Obj.addEventListener(“click“,method3,false);执行顺序为method1-》method2-》method3 《pre t=“code“ l=“java“》document.getElementById(“btn“).onclick = method1;
document.getElementById(“btn“).onclick = method2;
document.getElementById(“btn“).onclick = method3;如果这样写,那么将会只有medhot3被执行
addEventListener和普通.onclick的区别
addEventListener是在FireFox上的用法。
addEventListener的参数一共有三个，语法为：
element.addEventListener(type,listener,useCapture)
详解
其中element是要绑定函数的对象。
type是事件名称，要注意的是“onclick“要改为“click“,“onblur“要改为“blur“,也就是说事件名不要带“on“。
listener当然就是绑定的函数了，记住不要跟括号
最后一个参数是个布尔值，表示该事件的响应顺序,下面重点介绍一下addEventListener的第3个参数(useCapture)。
userCapture若为true,则浏览器采用Capture,若为false则采用bubbing方式。建议用false
区别：varbtn1Obj=document.getElementById(“btn1“);//element.addEventListener(type,listener,useCapture);btn1Obj.addEventListener(“click“,method1,false);btn1Obj.addEventListener(“click“,method2,false);btn1Obj.addEventListener(“click“,method3,false);执行顺序为method1-》method2-》method3
document.getElementById(“btn“).onclick=method1;document.getElementById(“btn“).onclick=method2;document.getElementById(“btn“).onclick=method3;如果这样写,那么将会只有medhot3被执行
addEventListener和attachEvent以及element.onclick的区别
attachEvent是ie添加事件处理程序，接收两个参数，其中事件类型名称要加“on“， 可以添加多个事件处理程序，按照添加顺序相反的顺序触发; addEventListener是给非ie添加事件处理程序，接收三个参数，第一个是事件名，不需要加“on”， 第二个是绑定的函数，第三个参数是一个布尔值，是事件的方式，意思是是否使用useCatch方式， 如果是false，就使用传统的冒泡方式，如果为true，就在捕获阶段调用事件处理程序。 addEventListener可以添加多个事件处理程序，按照添加顺序触发 二者有个本质上的区别，attachEvent的事件处理程序会在全局作用域中运行，this等于window对象， 而addEventLinstener添加的事件处理程序是在其依附的元素的作用域中运行的，this等于绑定元素对象。
更多文章：
majority of（the majority of 和 a majority of的区别以及用法例句）
2026年10月11日 07:40
2026年10月11日 07:20
2026年10月11日 06:30
2026年10月11日 06:20
2026年10月11日 05:40
another time（another time和other time的区别）
2026年10月11日 05:00
2026年10月11日 04:50
2026年10月11日 03:00
2026年10月11日 02:40
2026年10月11日 02:20
