如何监听一个DOM元素大小变化的动态变化?
- 内容介绍
- 文章标签
- 相关推荐
本文共计1114个文字,预计阅读时间需要5分钟。
1. 需求场景+开发过程中常遇到的一个问题就是如何监听一个+div+的size变化。例如,我用canvas绘制了一个chart,当canvas的size发生变化时,需要重新绘制其内容。这时,就需要监听size变化。
1.需求场景
开发过程中经常遇到的一个问题就是如何监听一个 div 的size变化。
比如我用canvas绘制了一个chart,当canvas的size发生变化的时候,需要重新绘制里面的内容,这个时候就需要监听resize事件做处理。window上虽然有resize事件监听,但这并不能满足我们的需求,因为很多时候,div的size发生了变化,实际 window.resize 事件并未触发。
对于div的resize事件的监听,实现方式有很多,比如定时器检查,通过scroll事件等等,本文主要介绍通过iframe 元素来实现监听。
不过我们可以间接利用window的resize事件监听来实现对于某个div的resize事件监听,请看下面具体实现。
本文共计1114个文字,预计阅读时间需要5分钟。
1. 需求场景+开发过程中常遇到的一个问题就是如何监听一个+div+的size变化。例如,我用canvas绘制了一个chart,当canvas的size发生变化时,需要重新绘制其内容。这时,就需要监听size变化。
1.需求场景
开发过程中经常遇到的一个问题就是如何监听一个 div 的size变化。
比如我用canvas绘制了一个chart,当canvas的size发生变化的时候,需要重新绘制里面的内容,这个时候就需要监听resize事件做处理。window上虽然有resize事件监听,但这并不能满足我们的需求,因为很多时候,div的size发生了变化,实际 window.resize 事件并未触发。
对于div的resize事件的监听,实现方式有很多,比如定时器检查,通过scroll事件等等,本文主要介绍通过iframe 元素来实现监听。
不过我们可以间接利用window的resize事件监听来实现对于某个div的resize事件监听,请看下面具体实现。

