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()方法添加了多个相同类型的事件监听器,它们将按照添加的顺序依次执行。而当使用属性赋值或其他方法替换事件监听器时,之前添加的监听器可能会被覆盖。

相关推荐
知识分享小能手25 分钟前
Vue3 学习教程,从入门到精通,Axios 在 Vue 3 中的使用指南(37)
前端·javascript·vue.js·学习·typescript·vue·vue3
七七&5563 小时前
2024年08月13日 Go生态洞察:Go 1.23 发布与全面深度解读
开发语言·网络·golang
java坤坤4 小时前
GoLand 项目从 0 到 1:第八天 ——GORM 命名策略陷阱与 Go 项目启动慢问题攻坚
开发语言·后端·golang
元清加油4 小时前
【Golang】:函数和包
服务器·开发语言·网络·后端·网络协议·golang
健康平安的活着4 小时前
java之 junit4单元测试Mockito的使用
java·开发语言·单元测试
烛阴5 小时前
精简之道:TypeScript 参数属性 (Parameter Properties) 详解
前端·javascript·typescript
DjangoJason6 小时前
C++ 仿RabbitMQ实现消息队列项目
开发语言·c++·rabbitmq
m0_480502646 小时前
Rust 入门 KV存储HashMap (十七)
java·开发语言·rust
大阳1236 小时前
线程(基本概念和相关命令)
开发语言·数据结构·经验分享·算法·线程·学习经验
YA3336 小时前
java基础(九)sql基础及索引
java·开发语言·sql