addEventListener('resize')
是用于在浏览器窗口大小变化时触发相应的事件处理函数。下面是 addEventListener('resize')
的用法:
// 通过addEventListener绑定resize事件处理函数
window.addEventListener('resize', handleResize);
// 定义resize事件处理函数
function handleResize(event) {
// 在窗口大小变化时执行的代码
// 可以在这里处理响应逻辑,如调整布局、重新计算元素位置等
}
使用 addEventListener('resize')
,我们可以将一个事件处理函数绑定到 window
对象上的 resize
事件。当浏览器窗口大小发生变化时,触发 resize
事件,然后执行相应的事件处理函数 handleResize
。
在事件处理函数中,你可以编写适当的代码来响应窗口大小变化。例如,你可以重新计算元素的位置、调整布局、重新渲染页面等操作。事件处理函数中的 event
参数可以提供关于事件的更多信息,例如窗口的新大小等。
注意:为了避免内存泄漏,在不需要监听 resize
事件时,最好使用 removeEventListener
方法将事件处理函数从 window
对象上移除,例如:
window.removeEventListener('resize', handleResize);
这样可以确保在不需要时停止监听窗口大小变化,以提高性能和资源利用效率。