最新的Web開發教程
 

JavaScript窗口 - 瀏覽器對象模型


瀏覽器對象模型(BOM)允許JavaScript“交談”瀏覽器。


瀏覽器對象模型(BOM)

還有對瀏覽器對象模型 (BOM)沒有正式的標準。

因為現代瀏覽器已經實現了(幾乎)為JavaScript交互相同的方法和屬性,它通常被稱為作為方法和材料清單的屬性。


Window對象

window的對象是所有瀏覽器都支持。 它代表了瀏覽器的窗口。

所有全局的JavaScript對象,函數和變量自動成為窗口對象的成員。

全局變量是window對象的屬性。

全局函數是window對象的方法。

即使是文檔對象(的HTML DOM)是窗口對象的屬性:

window.document.getElementById("header");

是相同的:

document.getElementById("header");

窗口大小

兩個屬性可以被用來確定在瀏覽器窗口的尺寸。

這兩個屬性返回的大小(像素):

  • window.innerHeight -瀏覽器窗口的內高度(以像素為單位)
  • window.innerWidth -瀏覽器窗口的內部寬度(以像素為單位)

瀏覽器窗口(瀏覽器窗口)不包括工具欄和滾動條。

對於Internet Explorer 8,7,6,5:

  • document.documentElement.clientHeight
  • document.documentElement.clientWidth
  • or
  • document.body.clientHeight
  • document.body.clientWidth

一個實際的JavaScript解決方案(包括所有的瀏覽器):

var w = window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;

var h = window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;
試一試»

這個例子顯示在瀏覽器窗口的高度和寬度(不包括工具欄/滾動條)


其他Window方法

一些其它的方法:

  • window.open() -打開一個新窗口
  • window.close() -關閉當前窗口
  • window.moveTo() -move當前窗口
  • window.resizeTo()調整大小當前窗口