事件处理
事件处理
在 DOM(文档对象模型)中,事件是指在网页中发生的交互动作,如点击、滚动、键盘输入等。当这些事件发生时,网页可以通过 JavaScript 来捕捉并处理它们,以便对用户的交互做出相应的反应。
DOM 事件的基本流程如下:
- 选定一个 HTML 元素。
- 注册一个事件监听器(也称为事件处理函数)来监听该元素上的特定事件。
- 当事件发生时,浏览器会调用该事件监听器,执行与其相关联的 JavaScript 代码。
在 JavaScript 中,可以使用 addEventListener() 方法来注册事件监听器。该方法的第一个参数是要监听的事件类型,比如 "click"、"scroll"、"keydown" 等等。第二个参数是事件发生时要执行的回调函数。回调函数中的代码会在浏览器调用该事件监听器时执行。
例如,以下代码将在页面上的按钮被点击时弹出一个提示框:
const button = document.querySelector('button');
button.addEventListener('click', function() {
alert('Button clicked!');
});
除了 addEventListener() 方法之外,还有一些其他的事件处理函数,比如 onmousedown、onkeydown 等等。这些方法与 addEventListener() 方法有一些区别,但基本的原理是相同的。