Javascript高级程序设计 第八章 --- BOM

window对象

BOM的核心对象是window，它表示浏览器的一个实例。
window 既是JavaScript访问浏览器的对象的接口，又是Global对象。

全局作用域

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

var age = 20
function sayAge(){
    alert(this.age);
}
alert(window.age);      // 20
sayAge();               // 20
window.sayAge();        // 20

---

窗口位置

IE、Safari、Opera和chrome都提供了 screenLeft 和 screenTop 属性，分别表示窗口相对于屏幕左边和上边。Firefox则支持 screenX 和 screenY 属性。

下面代码可以跨浏览器取得窗口左边和上边的位置。

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

窗口大小

在IE、Firefox、Safari、Opera和chrome中，document.documentElement.clientWidth和
document.documentElement.clientHeight中保存了页面视口信息。

---

间歇调用和超时调用

超时调用

超时调用 需要使用 window对象的 setTimeout()方法，接受两个参数：

• 要执行的代码
• 以毫秒表示的事件（即在执行代码前需要等待多少毫秒）

setTimeout(function(){
    alert("Hello world!");   
},1000);

调用 setTimeout()之后，该方法返回这个数值ID，表示超时调用。
要执行尚未执行的超时调用，可以调用 clearTimeout()方法，并将对应的超时调用ID作为参数传递给它。

// 设置超时调用
var timeouId = setTimeout(function(){
    alert("Hello world!");
},1000);

// 注意：把它取消
clearTimeout(timeoutId);

间歇调用

间歇调用 的方法是setInterval()参数 和 setTimeout()方法类似。

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

intervalId = setInterval(incrementNumber, 500);

---

系统对话框

浏览器通过 alert()、confirm() 和 prompt()方法可以调用系统对话框向用户显示信息。