web-utils-super/checkInView.js

前端函数库

/**
 * @desc: 判断元素是否在可视区域内（懒加载和无限滚动，但是每次scroll都得重新计算，性能耗费大，会引起重绘回流）
 * @param {HTMLElement} dom
 * @return {Boolean}
 */
function checkInView(dom) {
  const { top, left, bottom, right } = dom.getBoundingClientRect()
  console.log(top, left, bottom, right)
  console.log(window.innerHeight, window.innerWidth)
  return (
    top >= 0 &&
    left >= 0 &&
    bottom <= (window.innerHeight || document.documentElement.clientHeight) &&
    right <= (window.innerWidth || document.documentElement.clientWidth)
  )
}