前端工程师必须掌握的技能：如何监听DOM宽高变化？

好的，可以使用MutationObserver来监听DOM宽高的变化。下面是一个示例代码：

function watchElementSize(element, callback) {
  const observer = new MutationObserver((mutationsList) => {
    for (const mutation of mutationsList) {
      if (mutation.type === 'attributes' && (mutation.attributeName === 'style' || mutation.attributeName === 'class')) {
        callback();
        break;
      }
    }
  });
  observer.observe(element, { attributes: true });
}

调用该方法可以实现对指定元素的宽高变化进行监听。其中，第一个参数为要监听的元素，第二个参数为当元素宽高变化时要执行的回调函数。

下面是一个使用示例：

<!-- HTML代码 -->
<div id="my-element"></div>

// JavaScript代码
const myElement = document.querySelector('#my-element');
watchElementSize(myElement, () => {
  console.log('myElement宽高发生变化');
});

上述代码会监听myElement元素的宽高变化，并在变化发生时输出一条日志。