iframe的body滚动事件是触发自身body还是父页面body的事件？

默认情况下，你为iframe加载的内部页面body绑定的滚动事件，只会响应iframe自身body的滚动行为，完全不会响应父页面body的滚动，核心原因和常见注意事项如下：

• 浏览器中iframe与父页面属于相互隔离的独立文档上下文，二者的DOM节点、事件监听体系完全分离，不会互相干扰。你在内部页面中通过类似document.body.addEventListener('scroll', 回调函数)的逻辑绑定事件时，监听对象本身就是内部页面的body节点，自然只会捕获该节点自身触发的滚动事件。
• 父页面的body滚动事件默认也不会穿透到iframe内部，除非你主动通过postMessage在父子页面之间做跨上下文通信，把父页面的滚动状态同步到iframe内部后，再手动触发对应逻辑。

如果你遇到绑定的滚动事件没有按照预期触发的情况，可以优先排查两个常见配置问题：

• 是否给iframe设置了height: 100%、overflow: hidden等样式，导致iframe内部的body没有滚动空间，所有滚动行为都发生在父页面，自然无法触发内部的滚动监听
• 是否绑定事件时错误将监听对象绑定到了window.top或者父页面的DOM节点上，这种情况才会监听父页面的滚动行为

内容的提问来源于stack exchange，提问作者Ali Hussain