【js】ページの高さを取るプロパティ
たたたそれぞれのプロパティは、ドキュメントまたはビューポートの高さを取得するために使用できますが、取得される高さは異なります。
document.body.scrollHeight：
body要素のスクロール高さを取得します。body要素の高さに加えて、その子要素の高さも含まれます。ドキュメント全体の高さを取得するために使用できます。
document.documentElement.scrollHeight：
HTML要素のスクロール高さを取得します。HTML要素は、ドキュメント全体をラップするコンテナであり、ドキュメント全体の高さを取得するために使用できます。
document.body.offsetHeight：
body要素の高さを取得します。スクロールバーを含む高さが取得されます。
document.documentElement.offsetHeight：
HTML要素の高さを取得します。スクロールバーを含む高さが取得されます。
document.body.clientHeight：
body要素のクライアント領域の高さを取得します。スクロールバーを含まない高さが取得されます。
document.documentElement.clientHeight：
ビューポートの高さを取得します。スクロールバーを含まない高さが取得されます。この値は、画面に表示されるコンテンツの高さに相当します。
たたたconst scrollHeight = document.body.scrollHeight;
const scrollPosition = window.innerHeight + window.pageYOffset;
if (scrollHeight - scrollPosition <= footerHeight) {
this.elem.style.position = 'absolute';
this.elem.style.bottom = footerHeight + 'px';
} else {
this.elem.style.position = 'fixed';
this.elem.style.bottom = '0';
}
window.innerHeight：
現在のビューポートの高さを表します。スクロールバーを除くブラウザウィンドウの高さに相当します。
window.pageYOffset：
現在のページのスクロール量を表します。ページの上端から現在のビューポートの上端までの距離に相当します。
window.innerHeight + window.pageYOffset：現在のビューポートの下端までの距離を表します。つまり、現在表示されているコンテンツの下端の位置に相当します。この値を使用すると、ユーザーが現在表示されているコンテンツの下にスクロールしたかどうかを判定することができます。