You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

ResizeObserver是否应触发隐藏元素监听?Chrome版本差异咨询

ResizeObserver在Chrome新版本中的触发差异与规范疑问

在使用ResizeObserver编写代码时,发现Chrome 109.0.5414.120及以上版本存在行为差异:对添加到DOM的隐藏div设置ResizeObserver后,旧版本Chrome不会触发监听,但新版本会立即触发。不确定是代码问题还是Chrome引入的Bug,想了解ResizeObserver的规范行为。

代码示例

HTML部分

<html>
  <body>
    <div id="main">

    </div>
  </body>
</html>

JavaScript部分

// toggle hidden to true or false
const hidden = true;

const mainDiv = document.createElement("div");
mainDiv.style.background = "blue";
mainDiv.style.width = "100px";
mainDiv.style.height = "50px";
mainDiv.hidden = hidden;
const a = new ResizeObserver((entries) => {
  alert("observer triggered");
});
a.observe(mainDiv);
document.getElementById("main")?.appendChild(mainDiv);

if (hidden) {
    setTimeout(() => {
    alert("timeout expired");
        mainDiv.hidden = false;
    }, 5000);
}

内容的提问来源于stack exchange,提问作者MonkBen

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.01 06:50:31