如何检测元素可见性（z-index、fixed、opacity 等）（Intersection Observer V2 替代方案）

Question

Intersection Observer V2 将引入新功能，以根据不透明度、z-index 和固定定位等因素检测实际能见度。

信息：https : //developers.google.com/web/updates/2019/02/intersectionobserver-v2

问题：是否有替代方法或 polyfill 来检测在当前浏览器中有效的实际可见性？

测试：https : //jsfiddle.net/v3kgewhf/

// Intersection Observer V2
const observer = new IntersectionObserver((changes) => {
  for (const change of changes) {
    // ?? Feature detection
    if (typeof change.isVisible === 'undefined') {
      // The browser doesn't support Intersection Observer v2, falling back to v1 behavior.
      change.isVisible = true;
    }
    if (change.isIntersecting && change.isVisible) {
      visibleSince = change.time;
    } else {
      visibleSince = 0;
    }
  }
}, {
  threshold: [1.0],
  //  Track the actual visibility of the element
  trackVisibility: true,
  //  Set a minimum delay between notifications
  delay: 100
}));```

Answer 1

另一种方法是使用带有 setInterval 延迟的方法来轮询您希望检测可见性的点，该延迟DocumentOrShadowRoot.elementFromPoint类似于您用作 Intersection Observer v2 的延迟的方法。

这是目前两者之间的 caniuse 链接，其中99% 以上的用户支持elementFromPoint ，而Intersection Observer v2仅支持 69% 以上的用户。