root 设指定为 document.body 时不会触发更新

上面的示例中, 滚动页面后, .box 的颜色会随着交叉面积的比例更新而变化,如果将 , root: document 改为 root: document.body, 会发现滚动页面后不会触发更新:

MDN 关于 root 参数用法中描述了 root 是被监听目标的祖先元素, 很显然,这里的 document.body 也是每个 .box 的祖先元素,但是实际上不起作用。

还有一个现象,就是通过 document.body.addEventListener('scroll', listener) 方法无法监听到滚动事件, 我想这两个问题很可能是存在着某种关联关系,目前还没有找到相关资料可以说明缘由~~

posted on 2022-06-01 10:19  y1j2x34  阅读(122)  评论(0编辑  收藏  举报