BOM（一）

window对象

所有在全局作用域中声明的变量、函数都会变成window 对象的属性和方法。

var a = 1;
function f1(){
    alert(this.a);
}
alert(a);//1
f1();//1
window.f1();//1

由于f1()存在于全局作用域中，因此this.a 被映射window.a，最终显示的仍然a的值。

全局变量不能通过delete 操作符删除，而直接在window 对象上的定义的属性可以。

var a = 1;
window.w = 2;
delete a;//返回false
delete window.w;//返回true
alert(a);//1
alert(w);//undefined

刚才使用var 语句添加的window 属性有一个名为[[Configurable]]的特性，这个特性的值被设置为false，因此这样定义的属性不可以通过delete 操作符删除。

尝试访问未声明的变量会抛出错误，但是通过查询window 对象，可以知道某个可能未声明的变量是否存在：

var a = b;//error,b未定义
var a = window.b;
alert(a);//undefined

窗口位置

IE、Safari、Opera 和Chrome 都提供了screenLeft 和screenTop 属性，分别用于表示窗口相对于屏幕左边和上边的位置。Firefox 则在screenX 和screenY 属性中提供相同的窗口位置信息，Safari 和Chrome 也同时支持这两个属性。
使用下面代码可以返回窗口位置：

var leftPos = (typeof window.screenLeft == "number") ?
window.screenLeft : window.screenX;
var topPos = (typeof window.screenTop == "number") ?
window.screenTop : window.screenY;

移动窗口：
moveTo()接收的是新位置的x 和y 坐标值，而moveBy()接收的是在水平和垂直方向上移动的像素数。

window.moveTo(0,0);
//将窗向下移动100 像素
window.moveBy(0,100);
//将窗口移动到(200,300)
window.moveTo(200,300);
//将窗口向左移动50 像素
window.moveBy(-50,0);

窗口大小

IE9+、Firefox、Safari、Opera 和Chrome 均为此提供了4 个属性：innerWidth、innerHeight、outerWidth 和outerHeight。在IE9+、Safari 和Firefox中，outerWidth 和outerHeight 返回浏览器窗口本身的尺寸（无论是从最外层的window 对象还是从某个框架访问）。在Chrome 中，outerWidth、outerHeight 与innerWidth、innerHeight 返回相同的值，即视口（viewport）大小而非浏览器窗口大小。

在IE，Firefox、Safari、Opera 和Chrome 中document.documentElement.clientWidth 和document.documentElement.clientHeight 中保存了页面视口的信息，；如果是混杂模式，就必须通过document.body.clientWidth 和document.body.clientHeight 取得相同信息。而对于混杂模式下的Chrome，则无论通过document.documentElement还是document.body 中的clientWidth 和clientHeight 属性，都可以取得视口的大小。

取得页面视口的大小：

var pageWidth = window.innerWidth,
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;
    }
}

对于移动设备，window.innerWidth 和window.innerHeight 保存着可见视口，也就是屏幕上可见页面区域的大小。移动IE 浏览器不支持这些属性，但通过document.documentElement.clientWidth和document.documentElement.clientHeihgt 提供了相同的信息。随着页面的缩放，这些值也会相应变化。

使用resizeTo()和resizeBy()方法可以调整浏览器窗口的大小。这两个方法都接收两个参数，其中resizeTo()接收浏览器窗口的新宽度和新高度，而resizeBy()接收新窗口与原窗口的宽度和高度之差。这两个方法只能对最外层的window 对象使用。

//调整到100×100
window.resizeTo(100, 100);
//调整到200×150
window.resizeBy(100, 50);
//调整到 300×300
window.resizeTo(300, 300);

打开窗口

使用window.open()方法既可以导航到一个特定的URL，也可以打开一个新的浏览器窗口。这个方法可以接收4 个参数：要加载的URL、窗口目标、一个特性字符串以及一个表示新页面是否取代浏览器历史记录中当前加载页面的布尔值。通常只须传递第一个参数，最后一个参数只在不打开新窗口的情况下使用。（true设置打开新窗口）。
参数二可以是下列值中的一个：指定框架的名称，_self、_parent、_top 或_blank。

close()方法关闭打开的窗口。

弹窗屏蔽程序

var wroxWin = window.open("http://www.wrox.com", "_blank");
if (wroxWin == null){
    alert("The popup was blocked!");
}

如果是浏览器扩展或其他程序阻止的弹出窗口，那么window.open()通常会抛出一个错误。因此，要想准确地检测出弹出窗口是否被屏蔽，必须在检测返回值的同时，将对window.open()的调用封装在一个try-catch 块中：

var blocked = false;
try {
    var wroxWin = window.open("http://www.wrox.com", "_blank");
    if (wroxWin == null){
        blocked = true;
    }
} catch (ex){
    blocked = true;
}
if (blocked){
    alert("The popup was blocked!");
}

间歇执行和间歇执行

setTimeout()方法，它接受两个参数：要执行的代码和以毫秒表示的时间（即在执行代码前需要等待多少毫秒）。
第一个参数可以是一个包含JavaScript 代码的字符串，也可以是一个函数，建议使用function。

setTimeout(function(){
    alert(1);
},1000);//一秒后弹出1

clearTimeout()：取消调用

var s = setTimeout(function(){
    alert(1);
},1000);//一秒后弹出1
clearTimeout(s);//取消执行

间歇执行：setInterval()
推荐第一个参数传入function。

setInterval (function() {
    alert("Hello world!");
}, 10000);  // 每隔10秒执行一次

取消间歇执行：clearInterval()

var num = 0;
var max = 10;
var intervalId = null;
function incrementNumber() {
    num++;
    //如果执行次数达到了max 设定的值，则取消后续尚未执行的调用
    if (num == max) {
        clearInterval(intervalId);
        alert("Done");
    }
}
intervalId = setInterval(incrementNumber, 500);

使用超时调用模拟间歇调用：

var num = 0;
var max = 10;
function incrementNumber() {
    num++;
    //如果执行次数未达到max 设定的值，则设置另一次超时调用
    if (num < max) {
        setTimeout(incrementNumber, 500);
    } else {
        alert("Done");
    }
}
setTimeout(incrementNumber, 500);

一般认为，使用超时调用来模拟间歇调用的是一种最佳模式。在开发环境下，很少使用真正的间歇调用，原因是后一个间歇调用可能会在前一个间歇调用结束之前启动。而像前面示例中那样使用超时调用，则完全可以避免这一点。所以，最好不要使用间歇调用。

系统对话框

alert()：弹出框；
confirm():返回一个布尔值，点击ok返回true，点击cancel返回false。
prompt():体会用户输入信息。prompt()方法接受两个参数：要显示给用户的文本提示和文本输入域的默认值（可以是一个空字符串）。如果用户单击了OK 按钮，则prompt()返回文本输入域的值；如果用户单击了Cancel 或没有单击OK 而是通过其他方式关闭了对话框，则该方法返回null。

var result = prompt("What is your name? ", "");
if (result !== null) {
    alert("Welcome, " + result);
}