监听元素进入或离开可视区域

// 只触发进入可视区域
const observer = new IntersectionObserver(([{ isIntersecting }]) => {
  // 如果元素出现在可视区域内触发
  if(isIntersecting) {
    // 元素进入可视区域
    console.log('Element is visible');
    // 停止观察
    observer.unobserve(document.querySelector('.targetElement'))
  }
})
// 开启观察（传入要观察的dom元素）
observer.observe(document.querySelector('.targetElement'))

// 进入和离开可视区域都
const observer = new IntersectionObserver(intersection => {
  // 处理可见性变化的回调函数
  intersection.forEach(entry => {
    if (entry.isIntersecting) {
      // 元素进入可视区域
      console.log('Element is visible');
    } else {
      // 元素离开可视区域
      console.log('Element is not visible');
    }
  })
})
// 开启观察（传入要观察的dom元素）
observer.observe(document.querySelector('.targetElement'))