JavaScript を使用したドキュメントの高さ計算の課題を克服する
JavaScript を使用してドキュメントの高さを決定すると、特定の Web サイトで問題が発生します。 Fandango や Paperback Swap などのプラットフォームでは、さまざまな JavaScript メソッドが正確な結果を生成できません。
問題
- $(document).height() が返されます。 Fandango の正しい値ですが、Paperback Swap でエラーがスローされます。
- document.height
-
に padding-bottom を適用しています。要素は、これらの問題のあるページには影響しません。
解決策: 包括的なアプローチ
var body = document.body,
html = document.documentElement;
var height = Math.max( body.scrollHeight, body.offsetHeight,
html.clientHeight, html.scrollHeight, html.offsetHeight );
ログイン後にコピー
ドキュメントの高さを正確に決定するには、包括的なアプローチが必要です。
このコードは、利用可能なすべての高さの最大値を計算します。オプション:-
- body.scrollHeight
- body.offsetHeight
- html.clientHeight
- html.scrollHeight
html.offsetHeight
考慮事項
-
- 注ドキュメントがロードされる前にドキュメントの高さを計算すると、値は常に 0 になります。
- コンテンツを動的に追加する場合、またはユーザーがウィンドウのサイズを変更できるようにする場合は、ドキュメントの高さの再計算が必要になる場合があります。
onload イベントまたはドキュメント準備完了イベントを使用すると、ロード時の高さの正確な計算が保証されます。
以上がJavaScript でドキュメントの高さを決定するのが非常に難しいのはなぜですか? 信頼できる解決策は何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。