【備忘録】【javascript】ページの一番下までスクロールしたかどうかを判定する方法

// 参考: https://ja.javascript.info/size-and-scroll-window
// ブラウザ間の差異をカバーする
// ページ全体の高さを取得する
const scrollHeight = Math.max(
  document.body.scrollHeight, document.documentElement.scrollHeight,
  document.body.offsetHeight, document.documentElement.offsetHeight,
  document.body.clientHeight, document.documentElement.clientHeight
);

// 一番下までスクロールした時の数値を取得(window.innerHeight分(画面表示領域分)はスクロールをしないため引く)
const pageMostBottom = scrollHeight - window.innerHeight;

window.addEventListener('scroll', () => {
    const scrollTop = window.pageYOffset || document.documentElement.scrollTop;

    // iosはバウンドするので、無難に `>=` にする
    if (scrollTop >= pageMostBottom) {
        console.log('一番下までスクロールしました');
    }
});

// ios系はバウンドするので <= としている
element.addEventListener('scroll', () => {
  element.scrollHeight  -  element.scrollTop <= element.clientHeight
});