Sorry, your browser cannot access this site
This page requires browser support (enable) JavaScript
Learn more >

监听div的动态宽高

技术

发布于：Sep 11, 2024

监听div的动态宽高

介绍

resize或者onResize事件是window才有的事件。
要监听div的宽高改变，就要监听window的resize后，做出了改变。
而只是改变div的宽度呢，比如侧边栏展开闭合，不改变window的宽度，而只是改变div的宽度。
使用 ResizeObserver api 可以单独监听div的宽高。

使用

1
2
3
4
5
6
const resizeObserver = new ResizeObserver((entries) => {
	//回调事件
	// entries 是一个数组，里面有每个被监听的dom的宽高信息
});
//监听对应的dom
resizeObserver.observe(dom元素);

参考资料

完美监听一个div尺寸的改变
ResizeObserver API

关于本人

HaiYao的博客
Git主页

更新于：Oct 7, 2025

前端

JS

评论