js传统事件注册方式和方法监听注册方式【2021.10.15】

最新推荐文章于 2023-09-13 14:12:44 发布
最新推荐文章于 2023-09-13 14:12:44 发布
阅读量780 收藏
点赞数
分类专栏： javascript_笔记专栏 文章标签： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/masierty/article/details/120782058
版权

一、传统注册方式

以on开头的事件，如：onclick

具有唯一性，最后注册的处理函数会覆盖前面的处理函数

常用事件：

  • onblur:失去焦点
  • onfocus:获得焦点
  • onload:页面或图加载完成
  • onmousedown:鼠标按钮被按下
  • onmouseup:松开鼠标按钮
  • onmouseover:移动鼠标
  • onmouseout:鼠标从某元素上离开
  • onkeydown:某个键盘按键被按下
  • onkeyup:某个键盘按键被松开
  • onkeypress:某个键盘按键被按下并松开
  • onchange:域的内容被改变
  • onselect:文本被选中
  • onsubmit:确认按钮被点击
  • onreset:重置按钮被点击

二、方法监听注册方式

没有唯一性，同一元素同一事件可以注册多个处理函数，按照注册顺序依次执行

语法格式：给谁注册.addEventListener('type',listener,[useCapture])

type:事件类型，为字符串类型，记得加引号，如click、mouseover等等，不能带on！

listener:事件处理函数，事件发生时调用该监听函数

useCapture：可选参数，是一个布尔值，默认false

删除事件：removeEventListener('type',listener)

轻盈的风
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
DOM注册事件：传统注册和方法监听注册
CZ-001的博客
05-12 796
方法监听注册方式是w3c 标准 推荐方式，addEventListener() 它是一个方法，IE9 之前的 IE 不支持此方法，可使用 attachEvent() 代替，方法监听同一个元素同一个事件可以注册多个监听器，按注册顺序依次执行。传统注册方式注重注册事件的唯一性，同一个元素同一个事件只能设置一个处理函数，最后注册的处理函数将会覆盖前面注册的处理函数。注册事件有两种方式：传统方式和方法监听注册方式。listener：事件处理函数，事件发生时，会调用该监听函数。attachEvent 事件监听方式。
bootcamp-2021
03-16
10. DOM API：学习如何使用 JavaScript 操作文档对象模型（DOM），包括添加、删除和修改元素，以及事件监听和触发。 11. AJAX 与 Fetch API：理解异步获取和发送数据的方法，包括传统的 XMLHttpRequest 和现代的 ...
JS中两种注册事件的区别
qq_57193827的博客
07-26 595
JS中两种注册事件的区别
JS事件详解
mengfanshaoxia的博客
02-16 803
目录 一、事件注册 1.1、传统注册方式 1.2、监听注册方式 1.3、两种注册方式比较 二、解绑事件 三、事件流 3.1、事件冒泡 3.2、事件捕获 四、事件对象 五、事件属性 5.1事件目标 5.2、事件委托 六、事件方法 6.1、阻止事件冒泡 6.2、阻止默认行为 6.2.1、阻止链接的默认行为 6.2.2、阻止提交按钮提交表单的默认行为 七、鼠标事件 一、事件注册 给元素添加事件就称之为注册事件，注册事件也叫绑定事件。注册事件有两种方式： （1）传统注册方
事件监听与传统事件的区别
Y1_1Y1_1y1_1y的博客
11-02 794
被老师问到了关于两者的区别，但是脑子中却很模糊，于是整理了以下文档： 1.传统注册事件：后面的事件会覆盖前面的事件 事件监听注册事件：addEventListener可以对同一个元素绑定多个事件（里面的事件类型是字符串 ，必定加引号 ，而且不带on），执行顺序从上到下依次执行 2.传统解绑方式使用的是指针指向null，举例：element.οnclick=null 事件监听采用removeEventListener来删除事件，注意事项：如果addEventListener添加的是一个匿名函数，则remove
注册监听的5种方式
weixin_30698527的博客
11-13 922
注册监听的5种方式: 　　1. 内部类形式 　　　　1)写一个类实现监听接口(写类的构造器并实现监听方法) 2)组件监听绑定这个类 　　2. 外部类形式 　　3. Activity本身作为事件监听器类 　　　　1)implement xxxListener 2)实现事件处理方法 　　4. 内部匿名类形式 　　5. 直接绑定到标签 　　　　 1 <!-- 在标签中...
2021-2022计算机二级等级考试试题及答案No.2396.docx
10-31
2. 事件监听器：在编程中，事件监听器是负责监听和响应事件的对象，通常在GUI编程中使用，如Java Swing或JavaScript中，用于处理用户交互。 3. 控件属性：Caption属性通常用于给控件添加标题或显示文本，Label、...
2021-2022计算机二级等级考试试题及答案No.15591.docx
10-28
10. 事件处理：事件可以被用来在特定时间执行任务，如定时任务、用户交互等。删除事件的处理通常不直接用DELETE EVENT这样的语法，这可能是SQL相关的操作。 11. 输入设备：键盘是控制台标准输入设备，用于输入文本...
学JavaScript七大留意事项(必看)_.docx
10-09
事件委托是一种优化JavaScript性能的技术，通过将事件监听器绑定到父元素而不是每个子元素，可以减少内存消耗和提高性能。例如，为列表项添加点击事件： ```html <h2>Great Web resources <li><a href=...
sgustok-2021
03-28
5. **事件和DOM操作**： - 事件处理：如点击（click）、改变（change）等，通过`addEventListener`绑定事件监听器。 - DOM操作：获取、修改和操作HTML元素，如`document.getElementById`、`innerHTML`、`...
注册事件的两种方式（传统注册事件、方法监听注册事件）
...
08-25 441
注册事件的两种方式 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <t
JavaScript基础-WebAPIs（DOM BOM）
qq_54422936的博客
08-14 766
JavaScript基础-WebAPIs（DOM BOM）
传统注册事件和监听事件的区别
weixin_43520992的博客
03-31 546
传统方式注册事件 具有唯一性,同一个元素的同类型事件会被后面的覆盖 <body> <button>传统注册事件</button> btn.onclick = function () { alert('传统方式注册事件') // 删除传统事件 btn.onclick = null; } //传统方式给同一个元素添加同样的事件，只会执行最后一个
DOM：注册事件的两种方式：传统方式和方法监听注册方式
weixin_46682277的博客
03-24 457
传统事件注册方式： 利用on开头的事件，比如：onclick onmouseover等 btn.οnclick=function(){} 特点：注册事件的唯一性(唯一性就是同一个元素同一个事件只能设置一个处理函数，最后的注册事件函数会覆盖前面注册的事件函数) 代码示例： <button class="btn1">按钮</button> <script> var btn1 = document.querySelector(".btn1"); btn1.οnclick
js循环添加监听器时 只有最后一个有效
轰炸大鱿鱼的博客
11-11 2644
尝试循环添加div后，循环给这些div添加监听器时，出现了bug，现象为只有循环中的最后一个监听器有效，该问题涉及到闭包，引用这篇博文中的第一个方法解决，下次遇到可参考: http://blog.csdn.net/playboyanta123/article/details/17241597
JavaScript注册监听事件与清除监听事件
zhangawei123的博客
11-04 8499
JavaScript中有两种方法可以注册监听事件，一种是传统的注册方式，on+事件名称的注册方法，如btn.onclick,还有方法监听事件注册方式，addEventListener()和ie8以下的attachEvent()。
JavaScript中注册事件的三种方式
m0_67937429的博客
10-12 2866
注册事件的三种方式
JavaScript注册、删除事件的两种方式--传统注册方式、方法监听注册方式
Dreamer
11-25 1650
JavaScript注册事件的两种方式–传统注册方式、方法监听注册方式 注册事件有两种方式：传统方式和方法监听注册方式。（还有一种IE9以前支持的方式attachEvent注册事件，现在不常用） 传统注册方式 利用on开头的事件，如onclick。 <button onclick = “alert(‘123’)”></button> btn.onclick = function(){} 传统事件注册具有唯一性：同一个元素同一个事件只能设置一个处理函数，最后注册的处理函数将会覆盖前面注
javaScript：事件注册与事件监听
最新发布
qq_52799985的博客
09-13 932
在JavaScript中，可以使用事件注册和事件监听来处理网页上的交互和用户操作。事件注册是指将事件处理函数与特定的事件关联起来，以便在事件触发时执行相应的代码。事件监听是一种更高级的事件处理方式，它能够在同一个元素上同时监听多个事件，并在事件触发时执行相应的处理函数。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值