Javascript TypeError: Type error when using IntersectionObserver() only in Safari

Question

我不明白为什么 Safari (13.0.2) 在使用 IntersectionObserver() 时抛出 TypeError: Type error。其他主要浏览器没有。

document.addEventListener("DOMContentLoaded", () => {

  const lazyImages = [].slice.call(document.querySelectorAll("img"));

  if ("IntersectionObserver" in window) {
    const observerOptions = {
      root: document,
      rootMargin: '500px'
    }

    let lazyImageObserver = new IntersectionObserver((entries, observer) => {
      entries.forEach((entry) => {
        if (entry.isIntersecting) {
          let lazyImage = entry.target;
          lazyImage.src = lazyImage.getAttribute("data-lazyload-src");
          lazyImageObserver.unobserve(lazyImage);
        }
      });
    }, observerOptions);

    lazyImages.forEach((lazyImage) => {
      lazyImageObserver.observe(lazyImage);
    });
  }
});

第 138 行是 let lazyImageObserver = new IntersectionObserver((entries, observer) => {

感谢任何提示！

Answer 1

我不知道如何将评论标记为答复。无论如何，@user4642212 的评论中使用 document.body 而不是 document 的建议有效。

Try document.documentElement or document.body instead of document

This may be related to document being an HTMLDocument, but the other two being HTMLElements each. Their prototype chains diverge after Node. Perhaps Safari can’t handle HTMLDocuments being roots in IntersectionObservers.

@SurajRao 提供的进一步阅读：

Javascript TypeError: Type error when using IntersectionObserver() only in Safari

Javascript TypeError: Type error when using IntersectionObserver() only in Safari

javascript

typeerror

intersection-observer