window 对象

在浏览器中，window对象指当前窗口，是页面的顶层对象，所有其他都是他的下属。

属性

window.closed 一般用来检查，使用脚本打开的新窗口是否关闭。 window.opener 打开当前窗口的父窗口，没有则返回null。 window.self，window.window 指向window 对象自身，只读属性。 window.devicePixelRatio 返回一个数值，表示一个 CSS 像素的大小与一个物理像素的大小之间的比率。

浏览器位置大小信息window.screenX window.screenY: 浏览器窗口左上角相对于当前屏幕左上角的像素距离 window.innerHeight和 window.innerWidth 属性，返回当前窗口视口的大小 window.outerHeight和window.outerWidth属性返回包括浏览器菜单和边框的总大小

多窗口相关
window.frames 获取frame 和 iframes window.length frame 总数

全局对象属性代理

window.document
window.location
window.navigator
window.history
window.locaStorage
window.sessionStorage
...

window.isSecureContext 返回当前是否是 HTTPS 环境

方法

交互window.alert()，window.prompt()，window.confirm()

回调执行requestAnimationFrame(): requestAnimationFrame 回调会：在当前帧所有 DOM 操作之后执行（例如样式更改、DOM 更新等，在浏览器进行回流和重绘之前 执行。

requestIdleCallback:保证将回调函数推迟到系统资源空闲时执行。

事件

window.onload = _ => {
	console.log('window. onload') // 所有资源加载完毕
}

window.addEventListener('DOMContentLoaded', _ => {
	console.log('DOMContentLoaded') // HTML 解析和 DOM Tree 构建完毕
})

onhashchange : 实现 SPA 哈希路由 onpopstate: 实现 SPA History路由

多窗口操作

在网页中引入 Iframe 就属于多窗口的场景

window.top：顶层窗口，即最上层的那个窗口
window.parent：父窗口
window.self：当前窗口，即自身

对于 Iframe 窗口，可以拿到 iframe 的window

var frame = document.getElementById('theFrame');
var frameWindow = frame.contentWindow;

<iframe>元素遵守同源政策，只有当父窗口与子窗口在同一个域时，两者之间才可以用脚本通信，否则只有使用window.postMessage方法。

window 对象 ​

属性 ​

方法 ​

多窗口操作 ​

window 对象

属性

方法

多窗口操作