ウィンドウの場所
【1】get
ブラウザ（Firefoxはサポートしていません）は、 screenLeftとscreenTopプロパティを提供します。これは、画面の左側と上部に対するウィンドウの位置をそれぞれ表すために使用されます。
ウィンドウが最大化されると、各ブラウザによって返される値は、次のコードを実行するときに同じではありません。 Chrome Returns Left：0; Top：0。 IEは左に戻ります：0; TOP：56（メニューバーがある場合、左：0; TOP：78）。 Safariは左に戻ります：-8; TOP：-8独自のバグのため
//ウィンドウを移動すると、値に変更があります
結果：左：0; TOP：93
screenXおよびscreenYプロパティ（IE8-）も同じウィンドウ位置情報を提供します。
[注] screenLeft 、 screenTop 、 screenX 、 screenYすべて読み取り専用のプロパティです。値を変更しても、ウィンドウが移動しません。
ウィンドウが最大化されると、各ブラウザによって返される値はまだ異なります。 Firefoxは左に戻ります：-7; TOP：-7。 Chromeはまだ左に戻ります：0; TOP：0。 IE9+は常に左に戻ります：-7; TOP：-7メニューバーが表示されているかどうかに関係なく。 Safariはまだ左に戻ります：-8; TOP：-8独自のバグのため
<div id = 'mydiv'> </div> <script> var timer = setInterval（function（）{mydiv.innerhtml = 'left：' + window.screenx + '; top：' + window.screeny;}）mydiv.onclick = function（）{clearinterval（）;} </scrip結果：左：0; TOP：93
互換性がある
ウィンドウの場所を取得するための互換性のある書き込み方法は次のとおりです
[注]各ブラウザの実装が異なるため、クロスブラウザー条件下で正確な座標値を取得することは不可能です。
var leftpos =（typeof windof.screenleft == "number"）？ window.screenleft：window.screenx; var toppos =（typeof windof.screentop == "number"）？ window.screentop：window.screeny; console.log（leftpos、toppos）;
【2】モバイル
moveTo()およびmoveBy()メソッドを使用して、ウィンドウを新しい場所に移動します。これらの2つの方法は、IEブラウザによってのみサポートされています。
moveTo() 、2つのパラメーター、つまり新しい位置のxとyの座標値を受信します
<div id = "mydiv">ここをクリック</div> <script> //ウィンドウを（0,0）mydiv.onclick = function（）{window.moveto（0,100）; } </script> moveBy() 、2つのパラメーター、つまり水平方向と垂直方向に移動するピクセルの数を受信します。
<div id = "mydiv">ここをクリック</div> <script> //ウィンドウを100ピクセルで下に移動しますmydiv.onclick = function（）{window.moveby（0,100）; } </script>ウィンドウサイズ
【1】get
outerWidthとouterHeightプロパティは、ブラウザウィンドウ自体のサイズを表すために使用されます。
[注] IE8-ブラウザーはサポートしていません
//クロムは外側の幅を返します：1920;外側：1030 // IE9 +およびFirefox Return outourwidth：1550; outerheight：838 // Safari Returns Outerwidth：1552; + window.outerheight
結果：外側：1440; outerheight：743
innerWidthとinnerHeightプロパティは、ブラウザのウィンドウサイズに等しいページサイズを表すために使用されます。ブラウザの境界線とメニューバー、アドレスバー、ステータスバーなどの幅を差し引いたものです。
[注]ページにフレームがある場合、<iframe>自体にもウィンドウプロパティがあるため、フレーム内のinnerWidthとinnerHeightプロパティは、フレーム自体のinnerWidthとinnerHeightプロパティを指します。
// chromeは内幅を返します：1920; innerheight：971 // ie9 + returns inernwidth：1536; innerheight：768 // firefoxはinnerwidth：1536; innerheight：755 // inenterwidth：1536; innerheight：764document：'Innerhtml ='Innerhltml ='Innerhltml ='Inheight：1536; window.innerwidth + '; innerheight：' + window.innerheight： ' + window.innerheight
結果： innerwidth：701; innerheight：40
document.documentElement.clientWidthおよびdocument.documentElement.clientHeight domのclientheightは、ページサイズを表すこともでき、 innerWidthおよびinnerHeight
[注]同様に、フレームワークにアクセスした場合、これらの2つのプロパティもフレームワークのプロパティを指します。
// chromeはinnerwidthを返します：1920; innerheight：971 // ie9+ returns inerwidth：1536; innerheight：768 // firefoxは内幅を返します：1536; innerheight：755 // safariは内幅を返します：1536; innerheight：764 document.body.innerhtml = 'clientWidth：' + document.documentelement.clientwidth + '; clientheight：' + document.documentelement.clientheight
結果： ClientWidth：701; ClientHeight：40
これらの2種類の属性はコンピューターで同じ値を表していますが、モバイル側では異なる用途があります。 innerWidthとinnerHeight 、視覚的なビューポート、つまりユーザーが見ているWebサイトの領域を表しています。 document.documentElement.clientWidthおよびclientHeight 、CSSレイアウトのサイズを参照するレイアウトビューポートを表します。
【2】調整
resizeTo()とresizeBy()の2つの方法を使用して、ブラウザウィンドウのサイズを変更します
[注] IEとSafariブラウザのみがサポートされています
resizeTo() 、ブラウザウィンドウの新しい幅と新しい高さの2つのパラメーターを受信します
<div id = "mydiv">ここをクリック</div> <script> mydiv.onclick = function（）{//ブラウザウィンドウを200,200ウィンドウにサイズ変更します。 resizeBy() 、ブラウザの新しいウィンドウの幅と高さの違いと元のウィンドウの2つのパラメーターを受信します。
<div id = "mydiv">ここをクリック</div> <script> mydiv.onclick = function（）{//ブラウザウィンドウ幅を100 window.resizeby（-100,0）;} </script>ウィンドウを開きます
window.open()メソッドは、特定のURLに移動したり、新しいブラウザウィンドウを開くことができます。このメソッドは、ロードするURL、ウィンドウターゲット、機能文字列、および新しいページがブラウザ履歴の現在ロードされているページを置き換えるかどうかを示すブールの4つのパラメーターを受信します。
パラメーター
【1 deしばしば最初のパラメーターのみを渡す必要があり、新しいウィンドウでデフォルトの開く必要があります
<div id = "mydiv">ここをクリック</div> <scrip> mydiv.onclick = function（）{window.open（ "http://baidu.com"）;} </script>【2】2番目のパラメーターは、既存のウィンドウまたはフレームワークの名前、または_ self、_parent、_top、_blankなどの開く方法を示します。
<div id = "mydiv">ここをクリック</div> <script> // open mydiv.onclick = function（）{window.open（ "http://baidu.com"、 '_ self'）;} </scrip>【3】3番目のパラメーターは、新しいウィンドウに表示されている機能を示すコンマ区切り設定文字列です
<div id = "mydiv">ここをクリック</div> <script> mydiv.onclick = function（）{//高さ500、幅500、垂直座標0、水平座標200のqq webページを開きます。 window.open（ "http://qq.com"、 "_blank"、 "height = 500、width = 500、top = 0、left = 200"）} </script>[4] 4番目のパラメーターは、2番目のパラメーターが存在するウィンドウに名前が付けられた場合にのみ役立ちます。最初のパラメーターで指定されたURLが、ウィンドウブラウジング履歴（TRUE）の現在のエントリを置き換えるか、デフォルトの設定であるウィンドウブラウジング履歴（FALSE）に新しいエントリを作成するかどうかを宣言するブール値です。
返品値
open()メソッドの返品値は、新しいウィンドウのウィンドウオブジェクトです
<div id = "mydiv">ここをクリック</div> <script> mydiv.onclick = function（）{var w = window.open（）; w.document.body.innerhtml = 'test text';} </script>新しく作成されたウィンドウオブジェクトには、開くオープンオブジェクトを開くオープナープロパティがあります
<div id = "mydiv">ここをクリック</div> <script> mydiv.onclick = function（）{var w = window.open（）; console.log（w.opener === window）; // true} </script>フィルター
ほとんどのブラウザには、ポップアップフィルタリングシステムがあります。通常、 open()メソッドは、ユーザーがボタンまたはリンクを手動でクリックする場合にのみ呼び出されます。 JavaScriptコードは通常、ブラウザが最初にロードされたときにポップアップウィンドウを開こうとすると失敗します。傍受した場合、返品値はundefinedです
<div id = "mydiv">ここをクリック</div> <script> var w = window.open（）; console.log（w）; // undefined </script>
窓が閉じます
open()新しいウィンドウを開くメソッドと同じように、メソッドはclose()ウィンドウを閉じます。ウィンドウオブジェクトWが作成されている場合、次のコードを使用してオフにすることができます
<div> <span id = "span1"> [ウィンドウ] </span> <span id = "span2">閉じるウィンドウ</span> </div> <script> var w; span1.onclick = function（）{w = window.open（）;} span2.onclick = function（）{if（w）{w）{w.close（）; }} </script>新しいウィンドウのオブジェクトWには、閉じているかどうかを検出するためのclosedプロパティもあります。
<div id = "mydiv">ここをクリック</div> <script> // falseを最初に表示し、次にtruemydiv.onclick = function（）{var w = window.open（）; console.log（w.closed）; // false settimeout（function（）{w.close（）; console.log（w.closed）; // true}、1000）; } </script>小さなアプリケーション
window.open()で返されるオブジェクトは、新しく開いたウィンドウの開閉を操作できます
<div id = "mydiv"> window </div> <script> var w = null; mydiv.onclick = function（）{// wが存在しない場合、つまり新しいウィンドウが開かれていないか、新しいウィンドウが閉じられていない場合、（！w）{w = window.open（ "http://baidu.com"、 "_blank"、 "height = 400、width = 400、top = 10、rept = 10"）; mydiv.innerhtml = 'close window'; // wが存在する場合、それは新しいウィンドウが開くことを意味します} else {w.close（）; w = null; mydiv.innerhtml = 'window'; }} </script>要約します
この記事では、主にJavaScriptブラウザーWindowsの基本操作を紹介します。理解するのは非常に簡単ですが、非常に実用的な機能です。 JavaScriptを毎日使用することに役立つことを願っています。