HTML正確な位置決め属性： ScrollLeft、ScrollWidth、ClientWidth、OffsetWidth
Scrollheight：オブジェクトのスクロールの高さを取得します。
ScrollLeft：オブジェクトの左の境界と、ウィンドウ内の現在表示されているコンテンツの左端の間の距離を設定または取得します
スクロールトップ：オブジェクトの上部とウィンドウ内の可視コンテンツの上部との間の距離を設定または取得します
scrollwidth：オブジェクトのスクロール幅を取得します
offseTheight：レイアウトまたは親座標によって指定された親座標に対するオブジェクトの高さを取得しますoffsetparentプロパティ
offsetLeft：オフセットParentプロパティによって指定されたレイアウトまたは親座標に対するオブジェクトの計算された左の位置を取得します
オフセット：オフセットプロパティで指定されたレイアウトまたは親座標に対するオブジェクトの計算されたトップ位置を取得します
event.clientxドキュメントに対する水平座標
ドキュメントに対するClienty垂直座標
event.offsetxコンテナに対する水平座標
event.offsetyコンテナに対する垂直座標
document.documentlement.scrolltop垂直にスクロールする値
event.clientx + document.documentlement.scrolltopドキュメントの水平座標 +垂直方向のスクロールの量
つまり、Firefoxの違いは次のとおりです。
IE6.0、FF1.06+：
次のようにコードをコピーします：clientWidth = width + padding
clientheight = height + padding
offsetWidth =幅 +パディング +ボーダー
offsetheight = height + padding + border
IE5.0/5.5：
clientWidth = width border
clientheight = height border
offsetWidth = width
offseetheight = height
ヒント：CSSのマージン属性は、クライアント幅、offsetWidth、clientheight、およびoffSeightとは何の関係もありません
Webページの可視領域幅：document.body.clientwidth
Webページの目に見える領域の高さ：document.body.clientheight
Webページの可視領域幅：document.body.offsetwidth（エッジラインの幅を含む）
Webページの目に見える領域の高さ：document.body.offsetheigh（エッジラインの高さを含む）
Webページの全文幅：document.body.scrollwidth
Webページの全文：document.body.scrollheight
Webページは高レベルで展開されています：document.body.scrolltop
展開されているWebページの左：document.body.scrollleft
Webページの主要部分：window.screentop
Webページのメインテキストの左：window.screenleft
高画面解像度：window.screen.height
画面解像度の幅：window.screen.width
画面利用可能なワークスペースの高さ：window.screen.availheight
画面利用可能なワークスペース幅：window.screen.availwidth
技術的なハイライト
このセクションのコードは、主にウィンドウに関するドキュメントオブジェクトの一部のプロパティを使用しています。これらのプロパティの主な機能と使用は次のとおりです。
ウィンドウサイズを取得するには、さまざまなブラウザに異なるプロパティとメソッドを使用する必要があります。ウィンドウの真のサイズを検出するには、netscapeの下でウィンドウ属性を使用する必要があります。 IEで体を検出する。ウィンドウサイズを取得するには、要素ではなく、ルート要素のサイズに注意を払う必要があります。
ウィンドウオブジェクトの内側幅プロパティには、現在のウィンドウの内部幅が含まれています。ウィンドウオブジェクトの内側のプロパティには、現在のウィンドウの内部高さが含まれています。
ドキュメントオブジェクトのボディ属性は、HTMLドキュメントのタグに対応しています。ドキュメントオブジェクトのDocumentRementプロパティは、HTMLドキュメントのルートノードを表します。
document.body.clientheightは、HTMLドキュメントが配置されているウィンドウの現在の高さを表します。 document.body.clientWidthは、HTMLドキュメントが存在するウィンドウの現在の幅を表します。
サンプルコード
コードコピーは次のとおりです。
<！doctype>
<html>
<head>
<title>
ブラウザウィンドウを調整してください
</title>
<メタcharset = "utf8">
</head>
<body>
<h2 align = "center">
ブラウザのウィンドウサイズを調整してください
</h2>
<hr>
<form action = "＃" method = "get" name = "form1" id = "form1">
<！ - ブラウザウィンドウの実際のサイズを表示 - >
ブラウザウィンドウの実際の高さ：
<input type = "text" name = "avalheight" size = "4">
<br>
ブラウザウィンドウの実際の幅：
<input type = "text" name = "avalWidth" size = "4">
<br>
</form>
<script type = "text/javascript">
<！ -
var winwidth = 0;
var winheight = 0;
関数finddimensions（）// function：dimensionsを取得します
{
//ウィンドウの幅を取得します
if（window.innerwidth）winwidth = window.innerwidth;
else if（（document.body）&&（document.body.clientwidth））winwidth = document.body.clientwidth;
//ウィンドウの高さを取得します
if（window.innerheight）winheight = window.innerheight;
else if（（document.body）&&（document.body.clientheight））winheight = document.body.clientheight;
//ドキュメントの奥深くにボディを検出して、ボディサイズを取得して、ウィンドウサイズをクリックします
if（document.documentelement && document.documentelement.clientheight && document.documentelement.clientWidth）{
winheight = document.documentelement.clientheight;
winwidth = document.documentelement.clientWidth;
}
//結果は2つのテキストボックスに出力されます
document.form1.availheight.value = winheight;
document.form1.availwidth.value = winwidth;
}
finddimensions（）;
//値を取得するために関数を呼び出します
window.onresize = finddimensions;
//->
</script>
</body>
</html>
ソースプログラムの解釈
（1）プログラムは、最初にウィンドウの現在の幅と高さを表示する2つのテキストボックスを含むフォームを作成し、その値はウィンドウサイズの変更とともに変化します。
（2）その後のJavaScriptコードでは、ウィンドウの高さと幅の値を保存するために、2つの変数winwidthとwinheightが最初に定義されています。
（3）次に、関数FindDimensions（）で、window.innerheightとwindow.innerwidthを使用して、ウィンドウの高さと幅を取得し、両方を上記の2つの変数に保存します。
（4）次に、ドキュメントに深く入り、本体を検出し、ウィンドウサイズを取得し、上記の2つの変数に保存することにより。
（5）関数の最後で、結果は名前でフォーム要素にアクセスすることにより、2つのテキストボックスに出力されます。
（6）JavaScriptコードの最後に、findDimensions（）関数を呼び出すことにより、操作全体を完了します。