如何获得动态大小的div的新大小？

要获得动态大小的div的新大小，可以通过以下步骤实现：

使用JavaScript监听div的大小变化事件。可以使用ResizeObserver API来实现监听，该API可以在div大小发生变化时触发回调函数。
在回调函数中，获取div的新大小。可以使用Element.getBoundingClientRect()方法来获取div的边界框信息，包括宽度和高度。
根据需要，可以对获取到的新大小进行进一步处理。例如，可以根据新大小调整其他元素的布局或样式。

以下是一个示例代码，演示如何实现获取动态大小的div的新大小：

<!DOCTYPE html>
<html>
<head>
  <style>
    #myDiv {
      width: 200px;
      height: 200px;
      background-color: red;
    }
  </style>
</head>
<body>
  <div id="myDiv"></div>

  <script>
    const myDiv = document.getElementById('myDiv');

    const resizeObserver = new ResizeObserver(entries => {
      for (let entry of entries) {
        const newWidth = entry.contentRect.width;
        const newHeight = entry.contentRect.height;
        console.log('New size:', newWidth, newHeight);
        // 在这里可以根据需要对新大小进行进一步处理
      }
    });

    resizeObserver.observe(myDiv);
  </script>
</body>
</html>

在上述示例中，我们创建了一个宽高为200px的div，并使用ResizeObserver API监听其大小变化。当div的大小发生变化时，回调函数会打印出新的宽度和高度。你可以根据实际需求，在回调函数中进行相应的处理。

腾讯云相关产品和产品介绍链接地址：