在元素上写事件和addEventListener()的区别[通俗易懂]

在元素上写事件和addEventListener()的区别[通俗易懂]在元素上写事件和addEventListent()的区别onclick添加事件不能绑定多个事件,后面绑定的会覆盖前面的。而addEventListener能添加多个事件绑定,按顺序执行。addEventListener方式,不支持低版本的IE。(attachEvent支持IE)。普通方式绑定事件后,不可以取消。addEventListener绑定后则可以用removeEvenListe…

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

在元素上写事件和addEventListener()的区别

  1. onclick添加事件不能绑定多个事件,后面绑定的会覆盖前面的。而addEventListener能添加多个事件绑定,按顺序执行。
  2. onclick只能冒泡,addEventListener()可以得到捕获or冒泡。
  3. addEventListener方式,不支持低版本的IE。(attachEvent 支持IE)。
  4. 普通方式绑定事件后,不可以取消。addEventListener绑定后则可以用 removeEvenListener 取消。
  5. addEventListener 是W3C DOM 规范中提供的注册事件监听器的方法。
addEventListener用法:

语法:
element.addEventListener( type , listener , useCapture )
– – 添加事件监听
– – type: 事件类型字符串,不使用“on”前缀
– – callback:事件处理程序(回调函数)
– – useCapture:可选参数,是否使用事件捕获的方式处理事件。不传递时,默认为false,表示不使用事件捕获(使用事件冒泡),如果需要显示事件捕获,则显示传递true。

如果你对事件捕获与冒泡不太了解请看:JS事件流介绍以及阻止事件冒泡

示例:

document.getElementById("item").addEventListener( 'click' , (event) => { 
   
	console.log(event)
}, false )

addEventListener 第三个参数:
为 true 时,浏览器采用Capture(捕捉)
为 false 时,浏览器采用bubbing(冒泡)– 建议使用!

addEventListener兼容写法:

IE9之前浏览器使用element.attachEvent(type, callback)

attachEvent(type, callback)

type:事件类型字符串,使用“on”前缀
callback:事件处理程序(回调函数)
注意:因为IE9之前只有事件捕获,没有事件冒泡,所有attachEvent没有第三个参数。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/157852.html原文链接:https://javaforall.net

(0)
上一篇 2022年7月27日 上午9:46
下一篇 2022年7月27日 上午10:00


相关推荐

  • java 应用监控_java监控服务器运行状态

    java 应用监控_java监控服务器运行状态每天记录学习,每天会有好心情。*^_^*每天都要认真学习,才能更加进步。└(^o^)┘在工作和学习的过程中要善于思考,勤于学习。并做出适当的记录,才能最快速的学习并掌握一项知识。希望在这个平台和大家一起共同成长,和大家分享一个SSM(MYECLIPSE)项目,该项目名称为基于web的java舆情监测系统。采用当前非常流行的B/S体系结构,以JAVA作为开发技术,主要依赖SSM技术框架,mysql数…

    2025年11月29日
    11
  • 进程管理之进程调度「建议收藏」

    进程管理之进程调度「建议收藏」文章目录一、进程调度基础1、进程调度定义2、进程调度目标二、基本调度算法1、先来先服务算法2、时间片轮转算法3、短任务优先算法4、优先级调度算法5、混合调度算法  在多进程并发的环境里,虽然从概念上看,有多个进程在同时执行,但在单个CPU下,在任何时刻只能有一个进程处于执行状态,而其他进程则处于非执行状态。那么问题来了,我们是如何确定在任意时刻到底由哪个进程执行,哪些不执行呢?这就涉及到进程管理…

    2026年4月18日
    4
  • java log4j 配置文件_[Java教程]log4j配置文件详解

    java log4j 配置文件_[Java教程]log4j配置文件详解[Java教程]log4j配置文件详解02016-07-2523:00:18在开发中经常会碰到日志,网上关于日志的框架也很多,像log4j、self4j、common-logging等,下面对log4j进行介绍。log4j是java开发的日志框架,具有低侵入的特点,其重点使用的部分是log4j的配置文件,有两格式的配置文件,一种###setloglevels###log…

    2022年9月30日
    4
  • 【图】用python实现有向图

    【图】用python实现有向图通过临界表的方式实现了图结构 classVertex object 节点对象 def init self key self key keyself connectedTo 存放指向的其它节点 以 Vertex 连接边 weight 的 defaddNeighb self nbr weight self connectedTo update nbr

    2025年11月13日
    4
  • python超链接格式_Openpyxl中的超链接样式「建议收藏」

    python超链接格式_Openpyxl中的超链接样式「建议收藏」4个答案:答案0:(得分:1)importopenpyxlfromopenpyxl.stylesimportFont,Color,colors#…#alternative1:sethyperlinkpropertytocelldeflink_1(cell,link,display=None):cell.hyperlink=linkcell.font=…

    2022年7月19日
    117
  • goland2021.3激活教程破解方法

    goland2021.3激活教程破解方法,https://javaforall.net/100143.html。详细ieda激活码不妨到全栈程序员必看教程网一起来了解一下吧!

    2022年3月15日
    572

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号