JS的监听事件

在JavaScript中,你可以使用监听器来捕获和处理不同类型的事件。通过添加事件监听器,你可以指定当特定事件发生时要执行的函数。

以下是几种常见的监听事件的方法:

  1. addEventListener():用于在目标元素上添加事件监听器。它接受三个参数:事件类型、要执行的回调函数、和一个可选的布尔值参数,用于指定事件是否在捕获阶段触发(默认为false,即在冒泡阶段触发)。例如:

    document.addEventListener("click", function(event) { console.log("Click event occurred."); });

2.onclick:直接将函数赋值给一个元素的onclick属性,以响应点击事件。例如:

复制代码
button.onclick = function() { console.log("Button clicked."); };

3.其他事件监听方法:除了以上两种方法,还有许多特定的事件监听方法,如onmouseoveronkeydown等。这些方法是DOM对象的属性,可以通过直接赋值函数来进行事件监听。例如:

复制代码
element.onmouseover = function() { console.log("Mouse over event occurred."); };

注意:如果使用addEventListener()方法添加了多个相同类型的事件监听器,它们将按照添加的顺序依次执行。而当使用属性赋值或其他方法替换事件监听器时,之前添加的监听器可能会被覆盖。

相关推荐
年老体衰按不动键盘2 分钟前
快速部署和启动Vue3项目
java·javascript·vue
灵感__idea7 分钟前
JavaScript高级程序设计(第5版):无处不在的集合
前端·javascript·程序员
liuyang-neu11 分钟前
java内存模型JMM
java·开发语言
星辰引路-Lefan39 分钟前
深入理解React Hooks的原理与实践
前端·javascript·react.js
江城开朗的豌豆1 小时前
JavaScript篇:函数间的悄悄话:callee和caller的那些事儿
javascript·面试
江城开朗的豌豆1 小时前
JavaScript篇:回调地狱退散!6年老前端教你写出优雅异步代码
前端·javascript·面试
TE-茶叶蛋1 小时前
Vue Fragment vs React Fragment
javascript·vue.js·react.js
我很好我还能学2 小时前
【面试篇 9】c++生成可执行文件的四个步骤、悬挂指针、define和const区别、c++定义和声明、将引用作为返回值的好处、类的四个缺省函数
开发语言·c++
蓝婷儿2 小时前
6个月Python学习计划 Day 16 - 面向对象编程(OOP)基础
开发语言·python·学习
渣渣盟2 小时前
基于Scala实现Flink的三种基本时间窗口操作
开发语言·flink·scala