Javascript IntersectionObserver和位置：绝对

当观察到的元素具有

position:absolute

且根不是 视口

我是不是遗漏了什么

（尝试删除

位置：绝对
以查看预期结果。）


let intersectionRoot=document.getElementById（“intersectionRoot”）；
让observeElement=document.getElementById（“observeElement”）；
设移位=false；//以内部为例
让interSectionObserver=新的interSectionObserver(
（条目，观察员）=>{
console.log（条目[0]。isIntersecting）
},
{root:intersectionRoot}
);
interSectionObserver.observed（observedElement）；
window.setInterval(
() => {
observeElement.classList.toggle（“移位”）
},
1000
)
#intersectionRoot{
背景色：红色；
宽度：100px；
高度：100px；
}
#观察{
位置：绝对位置；
背景颜色：绿色；
宽度：50px；
高度：50px；
}
.转移{
转换：translate3d（110px，0，0）
}
解决方案是将
位置：relative
添加到根元素。这里有一个更新的

如果没有显式地将
位置：相对
设置为根元素，则其子元素（在本例中
observeElement
）将引用
主体。从：
中，具有非空根的IntersectionObserver被称为显式根观察者，它可以观察包含块链中根的后代的任何目标元素。
如果我遗漏了一些内容，很抱歉，如果您将
位置：相对
添加到
#intersectionRoot
？这是预期的行为吗？是的，看起来不错。对于IntersectionObserver为什么会这样工作，有没有合理的解释？我想这是因为如果您没有明确地将
位置：relative
设置为根元素，那么它的子元素（在本例中
observeElement
）指的是
主体。从：
中，具有非空根的IntersectionObserver被称为显式根观察者，它可以观察包含块链中根的后代的任何目标元素。
Ohh这很棘手。如果视觉交叉点是最重要的，那么就更容易理解了。无论如何，谢谢你，如果你把它作为一个答案，我会接受它。