intersectionobserver 的 rootmargin 在视口失效的原因分析
使用 IntersectionObserver 实现图片懒加载等功能时，rootMargin 属性常被用来调整目标元素触发回调的时机。然而，当 root 属性设置为 null (即使用视口作为根元素) 时，rootMargin 有时会失效。
这并非 rootMargin 本身的问题，而是由于其工作机制与 CSS margin 的差异造成的误解。rootMargin 定义的是相对于 root 元素的额外边界，而非目标元素本身的边界。它扩展的是 root 元素的观察区域，而不是目标元素的大小。
例如，rootMargin: "0px 50px" 表示在 root 元素的左右两侧各扩展 50px 的观察区域，上下边界不变。要扩展上下边界，则应使用 rootMargin: "50px 0px"。
因此，当 root 为 null (视口) 时，rootMargin 扩展的是视口区域，而非目标元素。如果预期行为与实际结果不符，可能是对 rootMargin 的作用机制理解有偏差。
为避免此类问题，建议将父级可滚动元素设置为 root，而不是直接使用视口。这能更精准地控制目标元素的观察区域，并确保 rootMargin 的有效性。
