Window 对象
概念
window 是客户端浏览器对象模型的基类,window 对象是客户端 JavaScript 的全局对象。一个 window 对象实际上就是一个独立的窗口,对于框架页面来说,浏览器窗口每个框架都包含一个 window 对象。
- 所有浏览器都支持 window 对象。它代表浏览器的窗口。
- 所有全局 JavaScript 对象,函数和变量自动成为 window 对象的成员。
- 全局变量是 window 对象的属性。
- 全局函数是 window 对象的方法。
如果文档包含框架(frame 或 iframe 标签),浏览器会为 HTML 文档创建一个 window 对象,并为每个框架创建一个额外的 window 对象。
window对象集合
- frames[] 返回窗口中所有命名的框架
生命周期
- DOMContentLoaded 浏览器完成HTML的加载, 并构建DOM树, 图片和样式等外部资源还没加载完成
- load 浏览器加载完所有资源, 包括HTML文档, 图片, 样式等
- beforeunload 用户即将离开, 用来检查用户是否保存了修改, 并询问是否真的要离开
- unload 用户几乎已经离开, 但是可以启动一些操作, 比如发送统计数据
常用属性
属性 | 用法 |
---|---|
document | 对document的只读引用 |
history | 对 History 对象的只读引用 |
Screen | 对 Screen 对象的只读引用 |
innerheight | 返回窗口的文档显示区的高度 |
innerwidth | 返回窗口的文档显示区的宽度 |
location | 用于窗口或框架的 Location 对象 |
top | 返回最顶层的先辈窗口,window |
……
常用方法
方法 | 描述 |
---|---|
setInterval() | 按照指定的周期(以毫秒计)来调用函数或计算表达式。 |
setTimeout() | 在指定的毫秒数后调用函数或计算表达式。 |
clearInterval() | 取消由 setInterval() 设置的 timeout。 |
clearTimeout() | 取消由 setTimeout() 方法设置的 timeout。 |
alert() | 显示带有一段消息和一个确认按钮的警告框。 |
scrollTo() | 把内容滚动到指定的坐标。 |
close() | 关闭浏览器窗口。 |
confirm() | 显示带有一段消息以及确认按钮和取消按钮的对话框。 |
open() | 打开一个新的浏览器窗口或查找一个已命名的窗口。 |
prompt() | 显示可提示用户输入的对话框。 |
resizeTo() | 把窗口的大小调整到指定的宽度和高度。 |
…… |
常见应用
全局作用域
由于 window 是全局对象,因此所有的全局变量都会被被解析为该对象的属性。
1 | var a = 100 |
我们也可将一些内部作用域的变量或数据挂载到window上,实现变量提升
1 | function fn(){ |
定时器
下面是一段获取手机验证码的函数代码
1 | getVcode() { |
页面滑动
doc社区页点击评论定位到编辑器位置
提示页面退出
文章发布页退出页面的未保存提示
……