JavaScript ウィンドウ - ブラウザオブジェクトモデル

ブラウザオブジェクトモデル (BOM)

ブラウザオブジェクトモデル (BOM) には正式な標(biāo)準(zhǔn)はありません。

最新のブラウザでは JavaScript の対話性のために (ほぼ) 同じメソッドとプロパティが実裝されているため、BOM と見(jiàn)なされることが多いメソッドとプロパティ。

window オブジェクト

ブラウザがドキュメントを開くと、window オブジェクトが作成されます。つまり、window オブジェクトはブラウザで開かれているウィンドウを表します。

ウィンドウオブジェクトはグローバルオブジェクトであり、ウィンドウのプロパティはグローバル変數(shù)として使用できます。たとえば、window.document の代わりに document と書くこともできます。同様に、Window.alert() の代わりにalert() を記述するなど、現(xiàn)在のウィンドウオブジェクトのメソッドを関數(shù)として使用できます。

ドキュメントにフレームが含まれている場(chǎng)合、ブラウザはドキュメントのウィンドウオブジェクトとフレームごとに追加のウィンドウオブジェクトを作成します。

ヒント: window オブジェクトに関連する明確な標(biāo)準(zhǔn)はありませんが、すべてのブラウザがこのオブジェクトをサポートしています。

HTML DOM のドキュメントも window オブジェクトの屬性の 1 つです:

window.document.getElementById("header");

これと同じ:

document.getElementById("header") ;

ウィンドウサイズ

ブラウザウィンドウ (ツールバーとスクロールバーを除くブラウザのビューポート) のサイズを決定するには 3 つの方法があります。

Internet Explorer、Chrome、Firefox、Opera、Safari の場(chǎng)合:

window.innerHeight - ブラウザウィンドウの內(nèi)側(cè)の高さ

window.innerWidth - ブラウザウィンドウの內(nèi)側(cè)の幅

Internet Explorer 8、7、6 の場(chǎng)合、5 :

document.documentElement.clientHeight

document.documentElement.clientWidth

または

document.body.clientHeight

document.body.clientWidth

実用的な JavaScript ソリューション (すべてのブラウザをカバー):

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文網(wǎng)(php.cn)</title>
</head>
<body>
<p id="demo"></p>
<script>
var w=window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;
var h=window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;
x=document.getElementById("demo");
x.innerHTML="瀏覽器window寬度: " + w + ", 高度: " + h + "。"
</script>
</body>
</html>

その他のウィンドウメソッド

その他のメソッド:

window.open() - 新しいウィンドウを開きます

window.close() - 現(xiàn)在のウィンドウを閉じます

window.moveTo() - 現(xiàn)在のウィンドウを移動(dòng)します

window .resizeTo( ) - 現(xiàn)在のウィンドウのサイズを変更します

學(xué)び続ける

新しいファイル

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> <script type="text/javascript"> myWindow=window.open('','','width=200,height=100') myWindow.document.write("This is 'myWindow'") myWindow.moveTo(0,0) </script> </head> <body> <p>把新窗口移動(dòng)到指定屏幕左上角（屏幕左上角為 0,0 坐標(biāo)，往右和下計(jì)算為正）</p> </body> </html>

提出するリセットコード

自動(dòng)運(yùn)転