获取用户是否使用普通javascript响应页面结尾

关于Stackoverflow这个问题有多种答案，但是大多数答案对我来说都不适用，或者是用jQuery编写的。如何检查是否已使用vanilla JavaScript到达页面底部，并根据该值添加/删除类？也许，我应该添加一些额外的补偿

const ERROR_OFFSET = 10;
const TOP_MIN_OFFSET = 100;

const doc = document.body;
const offset = window.innerHeight + window.pageYOffset;
const height = doc.scrollHeight;

if (offset >= height) {
  // We are on the bottom. Does not always work =(
  document.documentElement.classList.remove('hideOnScroll');
  return;
}

---

也许您可以尝试使用window.scrollHeight代替document

下面是我的代码，与之类似，但在if语句中使用1，可以使用100

window.onscroll = showBar;
const headerNav = document.getElementById(`headernav`);

   function showBar() {
   if (window.pageYOffset >= 1) {
    headerNav.classList.add(`scrolled`);
     } 
   else {
     headerNav.classList.remove(`scrolled`);
    }

   }
     
    
    

---

这段代码应该改进吗，或者下面的代码还有其他解决方案吗？如果已经到达页面底部，则会触发什么增强？您可以在页面底部放置一个隐藏的div（例如1像素高）然后使用？As@evolutionxbox检测它说IntersectionObserver是一个不错的选择，或者您可以使用

document.documentElement.clientHeight

获取视口的实际高度如何使用IntersectionObserver？我应该使用refs获取元素，还是如何获取？