javascript - 有没有一种方法可以使用 Javascript 检测所有 Ancestor DOM 元素的调整大小/缩放？

Question

我有一个包含图表的 DOM 元素

<div id="plot1" class='plot-chart'></div>

这个DIV可以嵌套在多个DIV中

<div id="one" style="width:100%;height:100%;zoom:0.9;">
    <div id="two">
        <div id="three">
            <div id="plot1" class='plot-chart'></div>
            </div>
        </div>
    </div>
</div>

我需要一种方法来检测对绘图 DIV 的所有祖先(父级)的大小/缩放的任何更改，以便我可以相应地缩放或调整它的大小。

window.onresize

这可以检测对整个浏览器窗口的任何更改，但可能存在 DIV 2 或 DIV 3 可能在窗口本身未被操作的情况下发生更改的情况。 Chart DIV 是我正在创建的，可以放置在任何位置，因此在调整大小时从外部调用函数不是解决方案。

为了简化问题，是否有任何方法可以检测对我的对象的任何父 DIV 的更改，以便我可以在内部调用函数？

Answer 1

所以简短的回答是“不”。但是，如果您对调整这些容器 div 大小的情况有任何控制，那么它们 可以触发自定义事件(例如，using jQuery)，您的图表可以监听这些事件并做出适当的 react 。

希望这对您有所帮助!