浅谈JavaScript之BOM

今天对JavaScript的BOM又重新学习了一遍，现在将BOM的基本知识总结一下，希望能帮到大家，随便复习一下。

基本对象

BOM表示的是浏览器对象模型，因为每个浏览器的自身属性大多数都是不同的，所以BOM本身没有很标准的规范，我们现在所学习的只是主流浏览器都共通的属性和方法。

Window对象

Window处于JavaScript结构的最顶层，它的下级拥有六大属性，分别是：
Document
Frams
History
Location
Navigator
Screen
值得注意的是这六个属性本身也是对象！
其中Document对象下有五大基本属性，分别是：
anchors
forms
images
links
location
同理这五个属性也都是对象。

系统对话框

Window对象下有三个基本的对话框方法：分别是：alert(),confirm()和prompt()，它们之间的区别是：
alert(),常常被用来当作警告框，这个方法本身只接受一个参数。
alert("这是一个警告框！");

confirm(),是确认提示框，它本身会提供两个选项，当用户点击选项后会返回一个布尔类型的值，我们通常通过这个返回值判断用户的操作，进而实现相应的功能。

var select=confirm("请选择");    if(select){        alert("您点击了确定按钮！");    }else{        alert("您点击了取消按钮！");    }

prompt(),方法会提供一个输入框可以接受两个参数（也可以有一个参数），第一个参数为提示信息，第二个参数为输入框中的默认值，，可以获取用户的输入内容。
prompt("请输入：",0);

prompt()方法本身的返回值就是用户的输入，如果返回值为null时则说明用户没有输入。

新建窗口

window对象提供了一个打开新窗口的方法–open(),下面就看一下不同参数代表的不同情况
-只有一个参数时，表示在一个新的窗口打开指定URL。
open("http://www.baidu.com");
-两个参数时，第一个参数同上，第二个参数可以是窗口名称，也可以是新页面打开的目标窗口,当第二个参数是窗口名称时，书写方式如下：

open("http://www.baidu.com","baidu");open("http://www.163.com","baidu");

那它和一个参数有什么区别呢，我们知道使用open()方法打开页面时默认会打开一个新的窗口，那么当我们添加了相同的窗口名称时就表示，我们再打开新的页面时都会在这个名称的窗口打开，不会再打开新的窗口。
第二种情况，有两个我们经常使用的目标字符串：_blank 和 _parent,分别代表了在一个空白页打开指定URL和在原有页面打开指定页面。
-第三个参数，就是设置窗口的配置，其中常用的有：width、height、top、left这四个属性，例如：

    open("http://www.baidu.com","parent","width=400,height=400,left=100,top=100");

在使用open()方法时要注意一点就是，这个方法的本身会返回一个window对象。

窗口位置

对于每个浏览器而言，计算窗口位置时的计算规则都是不同的，而且也有兼容性问题，出firefox外使用ScreenLeft和ScreenTop，而火狐浏览器本身也制订了专门的属性，即ScreenX和ScreenY，所以兼容所有浏览器的浏览器窗口位置的方法如下：

var leftX = typeof window.ScreenLeft == "number" ? Window.ScreenLfet : ScreenX;

这样即可兼容所有浏览器，其中将window对象书写 出来的目的是，防止火狐因为不识别ScreenLeft而报错。

窗口大小

除IE浏览器外，给定的页面大小的属性有：innerWidth和innerHeight（视口大小），outerWidth和outerHeight（视口大小+边框），但是IE浏览器不支持这两个属性，同时在IE6下的标准模式和怪异模式这两种不同的模式下使用的属性也不同，所以兼容所有浏览器的窗口大小的方法如下：

var width = window.innerWidth;var height = window.innerHeight;if(typeof width != "number"){  //此时表示IE浏览器    if(document.compatMode == "CSS1Compat"){        //此时表示标准模式        width = document.documentElement.clientWidth;        height = document.documentElement.clientHeight;    }else{        //此时表示怪异模式        width = document.body.clientWidth;        height = document.body.clientHeight;    }}alert(width);alert(height);

---

以上就是Window对象的一些基本概念。