BOM也叫做浏览器对象模型,它提供了很多对象,用于访问浏览器的功能;这些功能与任何网页内容无关;
BOM缺少规范,每个浏览器提供商都按照自己的想法去扩展它,那么浏览器共有对象就成了事实的标准;

一 window对象

// BOM的核心对象是window,它表示浏览器的一个实例;// window对象处于JavaScript结构的最顶层;// 对于每个打开的窗口,系统都会自动为其定义window对象;// window对象同时扮演着ECMAScript中Global对象的角色,因此所有在全局作用域中声明的变量/函数都会变成window对象的属性和方法;// PS:尝试访问未声明的变量会抛出错误,但是通过查询window对象,可以知道某个可能未声明的对象是否存在; var newValue = oldValue; // =>ReferenceError:oldValue is not defined; var newValue = window.oldValue; // =>undefined;

1.window对象的属性和方法
window对象有一系列的属性,这些属性本身也是对象;

(1).属性
属性 含义
closed 当窗口关闭时为真;
defaultStatus 窗口底部状态栏显示的默认状态信息;
document 窗口中当前显示的文档对象;
frames 窗口中的框架对象数组;
history 保存有窗口最近加载的URL;
length 窗口中的框架数;
location 当前窗口中的URL;
name 窗口名;
offscreenBuffering 用于绘制新窗口内容并在完成后复制已存在的内容,控制屏幕更新;
opener 打开当前窗口的窗口;
parent 指向包含另一个窗口的窗口(由框架使用);
screen 显示屏幕相关信息,如高度/宽度(以像素为单位;)
self 指示当前窗口;
status 描述由用户交互导致的状态栏的临时信息;
top 包含特定窗口的最顶层窗口(由框架使用);
window 指示当前窗口,与self等效;

(2).方法
alert(text) 创建一个警告对话框,显示一条信息;
blur() 将焦点从窗口移除;
clearInterval(interval) 清除之前设置的定时器间隔;
clearTimeOut(timer) 清除之前设置的超时;
close() 关闭窗口;
confirm() 创建一个需要用于确认的对话框;
focus() 将焦点移至窗口;
open(url,name,[options]) 打开一个新窗口并返回新window对象;
prompt(text,defaultInput) 创建一个对话框要求用户输入信息;
scroll(x,y) 在窗口中滚动到一个像素点的位置;
setInterval(expression,milliseconds) 经过指定时间间隔计算一个表达式;
setInterval(function,millisenconds,[arguments]) 经过指定时间间隔后调用一个函数;
setTimeout(expression,milliseconds) 　　　　　　　在定时器超过后计算一个表达式;
steTimeout(function,milliseconds,[arguments]) 在定时器超过后调用一个函数;
print() 调出打印对话框;
find() 调出查找对话框;
// window下的属性和方法,可以使用window.属性、window.方法()或者直接属性、方法()的调用;
// window.alert(text)=alert(text);

2.系统对话框
浏览器通过alert()/confirm()和prompt()方法调用系统对话框向用户显示信息;
系统对话框与浏览器中显示的网页没有关系,也不包含HTML;
它们的外观由操作系统及(或)浏览器设置决定,而不是由CSS决定;
这几个方法打开的对话框都是同步和模态的;也就是说,显示这些对话框的时候代码会停止运行,而关掉这些对话框后代码又会恢复执行;

// 弹出警告 alert('警告');// 确认和取消 if(confirm('请确定或取消'){ // confirm()本身有返回值; alert('您选择了确定'); // 按确定,返回true值; })else{ alert('您选择了取消'); // 按取消,返回false值; }// 输入提示框 var num = prompt('请输入一个数字',0); // 第一个参数是文字提示;第二个参数是输入框模式填充值;并返回输入框中的值; alert(num); // 将prompt()方法返回的值赋给变量num;并弹出;// 调用打印及查找对话框 print(); // 打印; 弹出浏览器打印窗口; find(); // =>boolean;页面有匹配的查找内容返回true;相对于Ctrl+F;// 状态栏 defaultStatus = '状态栏默认文本'; // 浏览器底部状态栏初始默认值; status = '状态栏文本'; // 浏览器底部状态栏设置值;

3.新建窗口(open())

// 使用window.open()方法可以导航到一个特定的URL,也可以打开一个新的浏览器窗口;
// 它接收四个参数:
// (1).要加载的URL;
// (2).窗口的名称或窗口目标;
// (3).一个特定字符串;
// (4).一个表示新页面是否取代浏览器记录中当前加载页面的布尔值;
open(''); // 在本页跳转到百度页面,并且可以避免产生跳转的历史记录;

三 history对象

history对象是window对象的属性,它保存着用户上网的记录,从窗口被打开的那一刻算起;

(1).history对象的属性

length history对象中的记录数;
(2).history对象的方法
back() 前往浏览器历史条目前一个URL,类似后退;
forward() 前往浏览器历史条目下一个URL,类似前进;
go(num) 浏览器在history对象中向前或向后;

复制代码 代码如下:
function back(){
history.back();
}
function forward(){
history.forward();
}
function go(num){
history.go(num);
}
// PS:可以通过判断history.length == 0,得到是否有历史记录;

四 小结

浏览器对象模型(BOM)以window对象为依托,表示浏览器窗口以及页面可见区域;
同时window对象还是ECMAScript中的Global对象,因而所有全局变量和函数都是它的属性,且所有原生的构造函数及其他函数也都存在于它的命名空间下;
(1).使用location对象可以通过编程方式来访问浏览器的导航系统;设置相应的属性,可以逐段或整体性地修改浏览器的URL;
(2).调用replace()方法可以导航到一个新的URL,同时该URL会替换浏览器历史记录中当前显示的页面;
(3).screen对象:保存着与客户端显示器有关的信息,这些信息一般只用于站点分析;
(4).history对象:为访问浏览器的历史记录开了一个小缝隙,开发人员可以据此判断历史记录的数量,也可以在历史记录中向后或向前导航到任意页面;