JavaScript之BOM（八）

BOM：浏览器对象模型（Browser Object Model），是一套 JS 与浏览器窗口交互的接口。
 

1、BOM中的对象

名称	描述
window	window 对象表示浏览器中打开的窗口，下列的5个对象都是window对象的属性或子对象。
navigator	navigator 对象包含有关浏览器的信息。
history	history 对象包含用户（在浏览器窗口中）访问过的 URL。
location	location 对象包含有关当前 URL 的信息。
screen	screen 对象包含显示器的分辨率、坐标等信息。
document	document 对象既是BOM中的对象之一，也是DOM中的对象之一，习惯上指的是HTML文档中的body部分。

2、window对象

2.1、简介

Window 对象是 JavaScript 层级中的顶层对象，代表一个浏览器窗口或一个框架，这个窗口中包含 DOM 结构，window.document 属性就表示 document 对象。
 
全局变量/函数会成为 window 对象的属性/方法。

2.2、常用的属性与方法

//浏览器窗口大小
innerHeight //浏览器窗口的内部高度
innerWidth //浏览器窗口的内部宽度

//弹出框
alert() //警告框
prompt() //提示框，提示用户输入信息，接受两个参数，即要显示给用户的文本和文本框中的默认值，将文本框中的值作为函数值返回
confirm()   //确认框，弹出一个具有OK和Cancel按钮的询问对话框，返回一个布尔值

//计时器相关
setInterval()   //按照指定的周期（以毫秒计）来调用函数或计算表达式。
setTimeout()    //在指定的延时时间后来执行代码
clearInterval() //取消setInterval()的设置
clearTimeout()  //取消setTimeout() 的设置

//其它
open()  //打开新窗口
close() //关闭当前窗口
print() //打印当前窗口的内容
focus() //把键盘焦点给予一个窗口
blur()  //把键盘焦点从顶层窗口移开
moveBy()    //可相对窗口的当前坐标把它移动到指定的像素
moveTo()    //把窗口的左上角移动到一个指定的坐标
resizeBy()  //按照指定的像素调整窗口的大小
resizeTo()  //把窗口的大小调整到指定的宽度和高度
scrollBy()  //按照指定的像素值来滚动内容
scrollTo()  //把内容滚动到指定的坐标

2.3、常用的事件

名称	描述
onresize	监听窗口改变大小事件
onscroll	监听窗口滚动事件

2.4、定时器和延时器

方法	描述
setTimeout(“函数”,间隔时间);	设置定时器
clearTimeout();	清除定时器
setInterval(“函数”,间隔时间);	设置延时器
clearInterval();	清除延时器

两者的区别：

1. setTimeout() 在指定间隔时间后，执行特定的函数或代码一次；
2. setInterval() 在指定间隔时间周期，重复执行特定的函数或代码；

两者的用法：

1. setInterval() 定时器，写在初始化函数或 <script> 脚本中调用一次即可；
2. setTimeout() 定时器，需要写在定时器调用的函数中，来实现setInterval()重复调用计时执行功能。

3、navigator 常用属性与方法

属性	说明
appName	完整的浏览器名称和版本信息
platform	浏览器所在的系统平台
plugins	浏览器中安装的插件信息的数 组
userAgent	浏览器的用户代理字符串
userLanguage	操作系统的默认语言

4、history 常用属性与方法

属性/方法	描述
length	history 对象中的记录数
back()	前往浏览器历史条目前一个 URL，类似后退
forward()	前往浏览器历史条目下一个 URL，类似前进
go(num)	浏览器在 history 对象中向前或向后，go(-1)为前进、go(1)为后退

5、location 常用属性与方法

名称	描述
href	设置或返回完整的 URL 地址
search	设置或返回从问号 (?) 开始的 URL（查询部分）
reload()	重新加载当前页面
replace()	把新的页面显示在浏览器中，替换掉当前页面内容，不能使用history对象来后退和前进。
assign()	把新的页面显示在浏览器中，但可以通过history历史对象来后退，回到前一个页面。

---

上一篇文章	下一篇文章
JavaScript语句（七）	JavaScript之DOM（九）