如何检查滚动时是否到达页面底部

window.addEventListener('scroll', function() {
  var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
  var windowHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
  var documentHeight = Math.max(document.body.scrollHeight, document.documentElement.scrollHeight);
  
  if (scrollTop + windowHeight >= documentHeight) {
    // 到达页面底部的逻辑处理
    console.log('到达页面底部');
  }
});

window.addEventListener('scroll', function() {
  var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
  var windowHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
  var documentHeight = Math.max(document.body.scrollHeight, document.documentElement.scrollHeight);
  var threshold = 50; // 阈值，可以根据实际情况调整
  
  if (documentHeight - scrollTop - windowHeight <= threshold) {
    // 到达页面底部的逻辑处理
    console.log('到达页面底部');
  }
});

var options = {
  root: null, // 默认为视窗
  rootMargin: '0px',
  threshold: 1.0 // 元素完全进入视窗时触发回调
};

var observer = new IntersectionObserver(function(entries, observer) {
  entries.forEach(function(entry) {
    if (entry.isIntersecting) {
      // 到达页面底部的逻辑处理
      console.log('到达页面底部');
    }
  });
}, options);

var target = document.querySelector('#bottom-element'); // 页面底部元素的选择器
observer.observe(target);