ページの高さを取得する JavaScript メソッド

<script><br>function getInfo()<br>{<br> var s = "";<br> s += " Web ページの可視領域の幅: "+ document.body.clientWidth;<br> s += " Web ページの可視領域の高さ: "+ document .body.clientHeight;<br> s += "Web ページの表示領域の幅: "+ document.body.offsetWidth + " (端とスクロール バーの幅を含む)";<br> s += "Web ページの表示領域の高さ: "+ document.body .offsetHeight + " (端の幅を含む)";<br> s += " Web ページ本文の全テキスト幅: "+ document.body.scrollWidth;<br> s += " Web ページ本文の全文の高さ: "+ document.body.scrollHeight;<br> s += " Web ページがスクロールされる高さ (ff): "+ document.body.scrollTop;<br> s += " Web ページがスクロールされる高さ (つまり): "+ document.documentElement.scrollTop;<br> s += " Web ページ 左にスクロールされる: "+ document.body.scrollLeft ;<br> s += " Web ページの本体: "+ window.screenTop;<br> s += " Web ページの本体の左側: "+ window.screenLeft;<br> s += " 高さ画面解像度: "+ window.screen.height;<br> s += " 画面解像度の幅: "+ window.screen.width;<br> s += " 画面の利用可能な作業領域の高さ: "+ window .screen .availHeight;<br> s += " 画面の利用可能な作業領域の幅: "+ window.screen.availWidth;<br> s += " 画面設定は "+ window.screen.colorDepth +" ビットカラー";<br> s += " 画面設定 "+ window.screen.deviceXDPI +" ピクセル/インチ";<br> //alert (s);<br>}<br>getInfo();<br></script>
私のローカル テストでは:
IE では、 FireFox と Opera では
document.body.clientWidth
document.body.clientHeight
を使用して取得できます。非常にシンプルで便利です。
社内プロジェクト:
Opera は依然として
document.body.clientWidth
document.body.clientHeight
を使用しますが、IE と FireFox は
document.documentElement.clientWidth
document.documentElement.clientHeight
を使用します。W3C 標準が問題を引き起こしていることが判明しましたああ

If inこの行のタグをページに追加すると
IE:
document.body.clientWidth ==> BODY オブジェクトの幅
document.body.clientHeight ==> BODY オブジェクトの高さ
document.documentElement.clientWidth ==>可視領域の幅
document.documentElement.clientHeight ==> 可視領域の高さ
FireFox の場合:
document.body.clientWidth ==> BODY オブジェクトの高さ
document.documentElement clientWidth ==> 可視領域の幅



可視領域の幅

document.body.clientHeight == > 可視領域の高さ

document.documentElement.clientWidth ==> ページ オブジェクトの幅 (つまり、BODY オブジェクトの幅とマージンの幅)
document.documentElement.clientHeight ==> ) )
W3C 標準が定義されていない場合、
IE は:
document.documentElement.clientWidth ==> 0
document.documentElement.clientHeight ==>
FireFox は:
documentElement.clientWidth == > ; ページ オブジェクトの幅 (つまり、BODY オブジェクトの幅とマージンの幅) document.documentElement.clientHeight ==> ページ オブジェクトの高さ (つまり、BODY オブジェクトの高さとマージンの高さ)
Opera は:
documentElement.clientWidth = => ページ オブジェクトの幅 (つまり、BODY オブジェクトの幅とマージンの幅) document.documentElement.clientHeight ==> ページ オブジェクトの高さ (つまり、BODY オブジェクトの高さとマージンの高さ)