window.addEventListener使用
时间: 2023-10-18 12:14:36 浏览: 46
`window.addEventListener`通常被用来监听浏览器窗口事件,比如窗口大小的改变、文档的加载、滚动等。它的语法如下:
```
window.addEventListener(event, function, useCapture);
```
其中,`event`是要监听的事件名称,比如`resize`、`load`或`scroll`等。`function`则是事件触发时要执行的JavaScript代码。`useCapture`是一个可选参数,它指定事件是否在捕获阶段处理。
下面是一个简单的例子,演示如何监听窗口大小改变事件:
```javascript
window.addEventListener('resize', function() {
console.log('窗口大小已改变');
});
```
当浏览器窗口大小发生改变时,上述代码会在控制台输出一条信息。
值得注意的是,`window.addEventListener`可以被用来监听任何DOM元素的事件,不仅仅是`window`对象。例如,我们可以监听一个按钮的点击事件,代码如下:
```javascript
var btn = document.querySelector('button');
btn.addEventListener('click', function() {
console.log('按钮被点击了');
});
```
上述代码会在按钮被点击时,在控制台输出一条信息。
相关问题
window.addEventListener 使用方法
window.addEventListener() 方法用于向指定窗口添加事件句柄。该方法接受三个参数:事件类型、事件处理程序和一个布尔值,指定事件是否在捕获或冒泡阶段执行。以下是使用 window.addEventListener() 方法的示例:
```javascript
// 添加事件监听器
window.addEventListener("resize", function(){
console.log("窗口大小已更改");
});
// 移除事件监听器
window.removeEventListener("resize", function(){
console.log("窗口大小已更改");
});
```
window.addEventListener的使用方法
window.addEventListener方法用于向指定的元素添加事件监听器。它接受两个参数:要监听的事件类型和事件发生时要执行的函数。
以下是window.addEventListener的使用方法的示例:
```javascript
// 添加resize事件监听器
window.addEventListener('resize', function() {
// 在窗口大小发生变化时执行的操作
console.log('窗口大小发生变化');
});
// 添加click事件监听器
window.addEventListener('click', function() {
// 在点击窗口时执行的操作
console.log('点击了窗口');
});
```
在上面的示例中,我们向window对象添加了两个事件监听器:一个是resize事件监听器,当窗口大小发生变化时会执行相应的操作;另一个是click事件监听器,当点击窗口时会执行相应的操作。
注意:在使用addEventListener方法添加事件监听器后,如果想要移除该事件监听器,可以使用window.removeEventListener方法。