ResizeObserver
1.window.resize事件可以监听窗口大小的变化,但是触发的频率较高,很容易导致性能问题,并且只有window对象才有resize事件,而不是具体到某个元素的变化
2.ResizeObserver可以监听到 Element 的内容区域或 SVGElement的边界框改变,内容区域则需要减去内边距 padding
注意:
需要将overflow设置为hidden 才生效
用法
const resizeObserver = new ResizeObserver(entries => {
// ...
});
方法
ResizeObserver.disconnect()
取消和结束目标对象上所有对 Element或 SVGElement 观察
ResizeObserver.observe()
开始观察指定的 Element或 SVGElement
ResizeObserver.unobserve()
结束观察指定的Element或 SVGElement