最新的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()调整大小当前窗口