如何解决 跨域 Iframe 的高度自适应：基于 MutationObserver 的动态同步

MutationObserver 必须放在子页面中，因父页无法访问跨域 iframe 的 contentDocument，否则触发 SecurityError；子页用它监听 DOM 变化并 postMessage 通知父页更新高度。 跨域 iframe 无法直接读取子页面 DOM，所以 MutationObserver 不能单独在父页使用来监听子页变化——它只能观察自身文档树。但 MutationObserver 可以作为 子页面内部的高度同步辅助手段 ，配合 postMessage 实现更精准、低延迟的高度适配。关键在于：把 MutationObserver 放在子页面里，监测自身内容变动，再主动通知父页。 为什么 MutationObserver 要放在子页面里 父页面对跨域 iframe 的 contentDocument 没有访问权限，任何试图用 + MutationObserver 的方案都会触发 SecurityError。真正可行的路径是： MutationObserver 运行在子页面上下文中，可自由监听 或根容器的结构/样式变化 一旦检测到高度可能变化（如 DOM 增删、图片加载完成、CSS 动画结束），立即计算新高度 通过 将高度值发给父页 父页仅需监听 message 事件并更新 iframe.style.height 子页面中用 MutationObserver 监听并上报高度 以下代码放在子页面（跨域）的