javascript中的BOM操作（JS高级程序设计第八章）

BOM的核心对象是window，它表示浏览器的一个实例。在浏览器中，window对象有双层角色，它既是通过js访问浏览器的一个接口，又是ECMAscript规定的Global对象。

---

1.全局变量会成为window对象的属性，但是直接定义全局变量和在window对象上直接定义属性还是有差别：全局变量不可以通过delete操作符删除，而直接在window对象上定义属性可以；尝试访问未声明的变量会抛出错误，但是通过查询window对象，可以知道某个变量是否存在。

var age = 24;
window.color = 'red';

delete window.age;                  //return false(在IE9下会报错)
delete window.color;                //return true(在IE9下会报错)

//oldValue未定义
var newValue = oldValue;            //抛出错误
var newValue = window.oldValue;     //不会抛出错误，newValue的值为undefined

---

2.窗口位置

获取窗口位置的方法。获取的是窗口相对于屏幕左边和顶部的位置。

        var leftPos = (typeof window.screenLeft === 'number') ?
                        window.screenLeft : window.scrollX;
        var topPos = (typeof window.screenTop === 'number') ?
                        window.screenTop : window.scrollMaxY; 

3.窗口大小

我们无法获取浏览器窗口的大小，但是可以获取页面视口大小（不包括标题栏、工具栏、滚动条等内容）。可参考我的另一篇博客。

        var pageWidth = window.innerWidth;
        var pageHeight = window.innerHeight;
        if(typeof pageWidth != 'number'){
            //确定页面是否处于标准模式
            if(document.compatMode == 'CSS1Compat'){
                pageWidth = document.documentElement.clientWidth;
                pageHeight = document.documentElement.clientHeight;
            }else{
                pageWidth = document.body.clientWidth;
                pageHeight = document.body.clientHeight;
            }
        }

4.window.open()方法即可导航到一个特定的URL，也可以打开一个新的浏览器窗口。可接收四个参数：要加载的URL，窗口目标（可以是已有的窗口或框架的名称，也可以是_self,_parent,_top,_blank）,一个特定的字符串以及一个表示新页面是否取代浏览器历史记录中当前加载页面的布尔值;可以调用close()方法关闭新打开的窗口。

    //弹出窗口屏蔽程序
    var blocked = false;
    try {
        var wrox =  window.open('https://www.baidu.com','_blank');
        if(wrox == null){
            blocked = true;
        }
    }catch (ex){
        blocked = true;
    }

    if(blocked == true){
        alert('the popup was blocked!');
    }

5.间歇调用和超时调用

setTimeout() clearTimeout() setInterval() clearInterval()

6.系统对话框

浏览器通过调用alert(),confirm(),promp()方法可以调用系统对话框向用户显示信息。这种外观由操作系统及浏览器设置决定，而不是由css决定。

window.location(),location.href(),location.assign()；
location.replace()。

3.BOM的对象window,location,navigator,screen,history。