jsはブラウザと画面のさまざまな幅と高さを取得します

1: ツールバーとスクロールバーを除く、Web ページの表示領域の幅と高さ (ブラウザウィンドウの表示領域のサイズ)

1 IE9+ の場合、Chrome。 、Firefox、Opera、Safari:

window .innerHeight ブラウザ ウィンドウの内側の高さ;

2 ブラウザ ウィンドウの内側の幅。 document.documentElement.clientHeight: HTML ドキュメントが配置されているウィンドウを表します。 document.documentElement.clientWidth: HTML ドキュメントが配置されているウィンドウの現在の幅を示します。 document オブジェクトの 6c04bd5ca3fcae76e30b72ad730ca86d は、HTML ドキュメントの 6c04bd5ca3fcae76e30b72ad730ca86d タグに対応します。

document. body.clientHeight: HTML ドキュメントが配置されているウィンドウの現在の高さを表します。 body.clientWidth: HTML ドキュメントが配置されているウィンドウの現在の幅を表します。

結論:

document.body.clientWidth/Height: 高さは小さく、高さはデフォルトでも200;

document.documentElement.clientWidth/Height と window.innerWidth/Height の幅と高さは常に等しいです。 したがって、さまざまなブラウザで実用的な Javascripit ソリューションは次のとおりです:

var w = document.documentElement.clientWidth || document.body.clientWidth;
var h = document.documentElement.clientHeight || document.body.clientHeight;

2: Web ページ本文のテキスト全体の幅と高さ

scrollWidth とscrollHeight は Web ページのコンテンツの高さと幅を取得します

1. Opera の場合: scrollHeight は、clientHeight より小さい可能性があります。

scrollHeight は、Web コンテンツの高さです。最小値は clientHeight です。つまり、Web コンテンツの実際の高さが clientHeight より小さい場合、scrollHeight は clientHeight を返します:

2:スクロール バーやその他の端を含む、Web ページの表示領域の幅と高さ (ウィンドウの表示サイズによって変わります)

1 値: offsetWidth =scrollWidth + left および rightスクロール バー + 左右の境界線;

オフセット高さ = スクロール高さ + 上下のスクロール バー + 上下の境界線

2.

var w = document.documentElement.scrollWidth || document.body.scrollWidth;
var h = document.documentElement.scrollHeight || document.body.scrollHeight;

3: 距離とスクロールされた Web ページのオフセット

1.scrollLeft:

指定されたオブジェクトの左端とウィンドウ内に現在表示されているコンテンツの左端の間の距離を設定または取得します2.scrollTop; :

指定されたオブジェクトの上部とウィンドウ内で現在表示されているコンテンツの左端の間の距離を設定または取得します。

3.offsetLeft:指定されたオブジェクト間の距離を設定または取得します。 offsetParent プロパティで指定されたレイアウトまたは親座標に対する相対位置

4.offsetTop:

offsetParent プロパティで指定されたレイアウトまたは親座標を基準にして計算された、指定されたオブジェクトの上部の位置を設定または取得します。

ブラウザや画面のさまざまな幅と高さを取得するためのその他の js 関連記事については、PHP 中国語 Web サイトに注目してください。