js window.addEventListener
时间: 2024-08-14 08:01:47 浏览: 108
`window.addEventListener` 是 JavaScript 中的一个内置方法,它允许你向网页窗口(`window` 对象)添加一个事件监听器。它的基本语法如下:
```javascript
window.addEventListener(eventType, listenerFunction, useCapture = false);
```
参数说明:
- `eventType`: 需要监听的事件类型,例如 `"click"`, `"load"`, `"DOMContentLoaded"` 等。
- `listenerFunction`: 当指定事件发生时要执行的函数,也称为事件处理器或回调函数。
- `useCapture` (可选): 如果设置为 `true`,则事件将首先在捕获阶段(从最上层元素向下传播)触发,如果为 `false`(默认),则在冒泡阶段(从最底层元素向上传播)触发。
示例:
```javascript
window.addEventListener("DOMContentLoaded", function() {
// 这里会在页面加载完成后立即执行,可以初始化数据或者布局
console.log("Page is loaded.");
});
```
在这个例子中,一旦页面的内容已经完全加载,`DOMContentLoaded` 事件处理器就会被调用。
相关问题
请用中文解释下列javascript代码,并对每一行代码进行逐行注释,注释行写在代码的上一行,要求尽可能详细: addListener() { window.addEventListener('page:close', this.closePageListener) window.addEventListener('page:refresh', this.refreshPageListener) window.addEventListener('unload', this.unloadListener) },
```javascript
// 添加监听器的函数
addListener() {
// 在 window 对象上添加 'page:close' 事件监听器,当该事件触发时调用 this.closePageListener 函数
window.addEventListener('page:close', this.closePageListener)
// 在 window 对象上添加 'page:refresh' 事件监听器,当该事件触发时调用 this.refreshPageListener 函数
window.addEventListener('page:refresh', this.refreshPageListener)
// 在 window 对象上添加 'unload' 事件监听器,当该事件触发时调用 this.unloadListener 函数
window.addEventListener('unload', this.unloadListener)
},
```
注释:
1. 定义了一个名为 `addListener` 的函数。
2. 在 `window` 对象上添加了一个名为 `'page:close'` 的事件监听器,当该事件触发时调用 `this.closePageListener` 函数。
3. 在 `window` 对象上添加了一个名为 `'page:refresh'` 的事件监听器,当该事件触发时调用 `this.refreshPageListener` 函数。
4. 在 `window` 对象上添加了一个名为 `'unload'` 的事件监听器,当页面卸载时触发,并调用 `this.unloadListener` 函数。
window.addEventListener
`addEventListener` 是 JavaScript 中的一个方法。它可以在 DOM 元素上为指定事件类型注册事件处理程序。使用方式如下:
```
element.addEventListener(event, function, useCapture);
```
- `event` 是事件类型的字符串,例如 "click"、"mouseover" 或 "submit"。
- `function` 是事件处理程序函数。
- `useCapture` 是一个可选的布尔值,表示事件是在捕获阶段还是在冒泡阶段处理。如果省略此参数,则默认为 false,即在冒泡阶段处理事件。
这个方法可以让你给任何 DOM 元素添加任意数量的事件监听器,而不用担心之前是否已经添加过。
阅读全文