new ResizeObserver

ResizeObserver 是一个相对较新的 JavaScript API，允许开发人员观察 DOM 元素大小的变化。它提供了一种有效地检测网页上元素尺寸变化的方式，这对于实现响应式设计、执行布局计算或基于元素调整大小触发操作非常有用。

以下是如何使用 ResizeObserver 的基本示例：

// 创建一个新的 ResizeObserver
const resizeObserver = new ResizeObserver(entries => {
  for (let entry of entries) {
    const { width, height } = entry.contentRect;
    console.log(`元素调整大小为 ${width}px x ${height}px`);
    // 根据元素的新尺寸执行操作
  }
});

// 选择要观察的元素
const targetElement = document.querySelector('.resize-me');

// 开始观察目标元素
resizeObserver.observe(targetElement);

在此示例中，使用 new ResizeObserver() 构造函数创建了 resizeObserver。它接受一个回调函数作为参数，该函数将在观察到的元素大小发生变化时被调用。在回调函数中，可以通过 ResizeObserverEntry 的 contentRect 属性访问观察到的元素的新大小。

记得将 '.resize-me' 替换为与你要观察大小变化的元素匹配的选择器。