肉渣教程

JS Window

上一节 下一节

JS window对象

window对象被所有的浏览器都支持;该对象代表浏览器窗口。

JavaScript中所有的全局对象、函数、变量都自动就是window对象的一部分。不过大多情况下,都不会去写window对象,因为能省则省呗~

window.alert( "反清复明" );

上面的代码与下面的代码完全等效。

alert( "反清复明" );

浏览器窗口的尺寸

通过以下两个属性则可获取或设置浏览器窗口的尺寸:

  • window.innerHeight - 浏览器视窗的内侧高度(单位:px)
  • window.innerWidth - 浏览器视窗的内测宽度(单位:px)

所谓浏览器视窗的内侧高度和宽度指代浏览器中纯显示页面的那部分视窗的高宽,不包括滚动条、工具条等部分。


但对于IE8浏览器以及IE7、IE6、IE5来说,则需要考虑兼容:

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

最佳兼容方式如下:

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

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

运行一下

JS window对象的方法

window对象的常用方法:

  • window.open() - 打开一个新窗口
  • window.close() - 关闭当前窗口
  • window.moveTo() - 把窗口的左上角移动到一个指定坐标
  • window.resizeTo() - 改变当前窗口的大小


运行一下


window.location.href - 通过JS使当前页面跳转到另外一个网址

window对象还有一个比较常用的技巧,通过window.location.href属性,不仅可以获取当前网址,还可以通过赋值,使当前页面跳转到另外一个网址。

window.location.href = "https://zhuanfou.com";

运行一下


JS Window

上一节 下一节