摘要：僅限數(shù)值表示新窗口的高度。一個(gè)字符串參數(shù)，并將其顯示給用戶，提供兩個(gè)按鈕，一個(gè)按鈕返回布爾值另一個(gè)按鈕返回布爾值。

window 在是BOM 的核心對(duì)象，他是瀏覽器的一個(gè)實(shí)例。

在全局作用域中聲明的變量、函數(shù)都會(huì)變成window 對(duì)象的屬性和方法。如：

var age = 18;
function sayAge(){
    console.log(window.age);
}

console.log(window.age); //18
sayAge(); //18
window.sayAge(); //18

定義全局變量與在 window 對(duì)象上直接定義屬性還
是有一點(diǎn)差別：全局變量不能通過 delete 操作符刪除，而直接在 window 對(duì)象上的定義的屬性可以。如：

var age = 29; // var 語句添加的 window 屬性[[Configurable]] 為 false
window.color = "red";
//在 IE < 9 時(shí)拋出錯(cuò)誤，在其他所有瀏覽器中都返回 false
delete window.age;
//在 IE < 9 時(shí)拋出錯(cuò)誤，在其他所有瀏覽器中都返回 true
delete window.color; //returns true
alert(window.age); //29
alert(window.color); //undefined

另外，通過查詢 window 對(duì)象，可以知道某個(gè)可能未聲明的變量是否存在，如：

var newValue = oldValue; //oldValue is not defined

var newValue = window.oldValue; //這個(gè)算是查詢，如果沒有定義也不會(huì)報(bào)錯(cuò)

每個(gè)框架都擁有自己的window 對(duì)象，并且保存在frames 集合中。每個(gè) window 對(duì)象都有一個(gè) name 屬性，其中包含框架的名稱。如：

以上代碼創(chuàng)建了一個(gè)框架集，其中一個(gè)框架居上，兩個(gè)框架居下?？梢酝ㄟ^window.frames[0] 或者 window.frames["topFrame"] 來引用上方的框架。不過，恐怕最好使用top 而非 window 來引用這些框架（例如，通過 top.frames[0] ）。

與 top 相對(duì)的另一個(gè) window 對(duì)象是 parent 。 parent （父）對(duì)象始終指向當(dāng)前框架的直接上層框架。在沒有框架的情況下， parent 一定等于top （此時(shí)它們都等于 window ）。如：

這個(gè)框架集中的一個(gè)框架包含了另一個(gè)框架集，該框架集的代碼如下所示。

如果代碼位于redFrame（或blueFrame）中，那么parent 對(duì)象指向的就是 rightFrame 。如果代碼位于topFrame 中，則parent 指向的是top。

與框架有關(guān)的最后一個(gè)對(duì)象是 self ，它始終指向 window ；實(shí)際上， self 和 window 對(duì)象可以互
換使用。引入 self 對(duì)象的目的只是為了與 top 和 parent 對(duì)象對(duì)應(yīng)起來，因此它不格外包含其他值。

screenLeft 和 screenTop 屬性，分別用于表示窗口相對(duì)于屏幕左邊和上邊的位置。Firefox 則在screenX 和 screenY 屬性中提供相同的窗口位置信息，Safari 和 Chrome 也同時(shí)支持這兩個(gè)屬性。Opera雖然也支持 screenX 和 screenY 屬性，但與 screenLeft 和 screenTop 屬性并不對(duì)應(yīng)，因此建議大家不要在 Opera 中使用它們。如：

上面這個(gè)代碼可以直接在input 中顯示screenLeft 或screenX 的值。

由于各種原因，無法在跨瀏覽器的條件下取得窗口左邊和上邊的精確坐標(biāo)值。

這兩個(gè)方法都接收兩個(gè)參數(shù)，其中moveTo() 接收的是新位置的 x 和 y 坐標(biāo)值，而 moveBy() 接收的是在水平和垂直方向上移動(dòng)的像素?cái)?shù)。如：

//將窗口移動(dòng)到屏幕左上角
window.moveTo(0,0);
//將窗向下移動(dòng) 100 像素
window.moveBy(0,100);
//將窗口移動(dòng)到(200,300)
window.moveTo(200,300);
//將窗口向左移動(dòng) 50 像素
window.moveBy(-50,0);

需要注意的是，這兩個(gè)方法可能會(huì)被瀏覽器禁用，這兩個(gè)方法都不適用于框架，只能對(duì)最外層的 window 對(duì)象使用。

在 IE9+、Safari和 Firefox中， outerWidth 和 outerHeight 返回瀏覽器窗口本身的尺寸。

在Opera中， outerWidth 和 outerHeight 這兩個(gè)屬性的值表示頁面視圖容器的大小。

而innerWidth 和 innerHeight則表示該容器中頁面視圖區(qū)的大小。

在 Chrome 中， outerWidth 、 outerHeight 與innerWidth 、 innerHeight 返回相同的值，即視口（viewport）大小。

IE8 及更早版本沒有提供取得當(dāng)前瀏覽器窗口尺寸的屬性，單可以通過DOM 取得可見區(qū)域的相關(guān)信息：

在 IE、Firefox、Safari、Opera 和 Chrome 中，document.documentElement.clientWidth 和document.documentElement.clientHeight 中保存了頁面視口的信息。

在 IE6 中，這些屬性必須在標(biāo)準(zhǔn)模式下才有效；如果是混雜模式，就必須通過 document.body.clientWidth 和 document.body.clientHeight 取得相同信息。

而對(duì)于混雜模式下的 Chrome，則無論通過 document.documentElement 還是 document.body 中的 clientWidth 和 clientHeight 屬性，都可以取得視口的大小。

所以無法準(zhǔn)確確定窗口本身的大小，但可以取得準(zhǔn)確的頁面視口的大?。?/p>

其他瀏覽器可以通過innerWidth 和innerHeight 取得；

IE8 之前可以通過DOM 取得：

標(biāo)準(zhǔn)模式下通過document.documentElement.clientWidth 和document.documentElement.clientHeight 取得；

混雜模式下通過document.body.clientWidth 和document.body.clientHeight取得；

可以用以下代碼獲取innerWidth 和innerHeight（其中，document.compatMode用來判斷當(dāng)前瀏覽器采用的渲染方式。BackCompat：標(biāo)準(zhǔn)兼容模式關(guān)閉。CSS1Compat：標(biāo)準(zhǔn)兼容模式開啟。）：

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;
    }
}

其他具體的有關(guān)移動(dòng)設(shè)備視口的話題，推薦學(xué)習(xí)移動(dòng)Web 開發(fā)。

這兩個(gè)方法都接收兩個(gè)參數(shù)，其中 resizeTo() 接收瀏覽器窗口的新寬度和新高度，而 resizeBy() 接收新窗口與原窗口的寬度和高度之差。如：

//調(diào)整到 100×100
window.resizeTo(100, 100);
//調(diào)整到 200×150
window.resizeBy(100, 50);
//調(diào)整到 300×300
window.resizeTo(300, 300);

有可能被瀏覽器禁用。

使用 window.open() 方法既可以導(dǎo)航到一個(gè)特定的 URL，也可以打開一個(gè)新的瀏覽器窗口。這個(gè)方法可以接收 4 個(gè)參數(shù)：要加載的 URL、窗口目標(biāo)、一個(gè)特性字符串以及一個(gè)表示新頁面是否取代瀏覽器歷史記錄中當(dāng)前加載頁面的布爾值。通常只須傳遞第一個(gè)參數(shù)，最后一個(gè)參數(shù)只在不打開新窗口的情況下使用。

//等同于< a  target="topFrame">
window.open("http://www.wrox.com/", "topFrame");

意思是在名為"topFrame"的框架中打開URL。這個(gè)參數(shù)也可以是： _self 、 _parent 、 _top 或 _blank 。

如果給 window.open() 傳遞的第二個(gè)參數(shù)并不是一個(gè)已經(jīng)存在的窗口或框架，那么該方法就會(huì)根據(jù)在第三個(gè)參數(shù)位置上傳入的字符串創(chuàng)建一個(gè)新窗口或新標(biāo)簽頁。如果沒有傳入第三個(gè)參數(shù)，那么就會(huì)打開一個(gè)帶有全部默認(rèn)設(shè)置的新瀏覽器窗口。第三個(gè)參數(shù)主要有：

fullscreen
yes 或 no 表示瀏覽器窗口是否最大化。僅限IE

height
數(shù)值  表示新窗口的高度。不能小于100

width
數(shù)值  表示新窗口的寬度。不能小于100

top
數(shù)值  表示新窗口的上坐標(biāo)。不能是負(fù)值

left
數(shù)值  表示新窗口的左坐標(biāo)。不能是負(fù)值

location
yes 或 no 表示是否在瀏覽器窗口中顯示地址欄。不同瀏覽器的默認(rèn)值不同。如果設(shè)置為no，地址欄可能會(huì)隱藏，也可能會(huì)被禁用（取決于瀏覽器）

menubar
yes 或 no 表示是否在瀏覽器窗口中顯示菜單欄。默認(rèn)值為 no

resizable
yes 或 no 表示是否可以通過拖動(dòng)瀏覽器窗口的邊框改變其大小。默認(rèn)值為 no

scrollbars
yes 或 no 表示如果內(nèi)容在視口中顯示不下，是否允許滾動(dòng)。默認(rèn)值為 no

status
yes 或 no 表示是否在瀏覽器窗口中顯示狀態(tài)欄。默認(rèn)值為 no

toolbar
yes 或 no 表示是否在瀏覽器窗口中顯示工具欄。默認(rèn)值為 no

注意，整個(gè)特性字符串中不允許出現(xiàn)空格。

有些瀏覽器不允許我們針對(duì)主瀏覽器窗口調(diào)整大小或移動(dòng)位置。通過 window.open 返回的對(duì)象，可以像操作其他窗口一樣操作新打開的窗口：

var newWindow = window.open("http://www.baidu.com/", "_blank","fullscreen=yes");
newWindow.resizeTo(400,1000);

調(diào)用 close() 方法還可以關(guān)閉新打開的窗口。

var newWindow = window.open("http://www.baidu.com/", "_blank","fullscreen=yes");

newWindow.close(); //打開之后立刻關(guān)閉

當(dāng)然也可以使用window.close()。

opener 屬性，其中保存著打開它的原始窗口對(duì)象。

var newWindow = window.open("http://www.baidu.com/", "_blank","fullscreen=yes");

document.write(newWindow.opener == window); //true

將 opener 屬性設(shè)置為 null 就是告訴瀏覽器新創(chuàng)建的標(biāo)簽頁不需要與打開它的標(biāo)簽頁通信，因此可以在獨(dú)立的進(jìn)程中運(yùn)行。

var newWindow = window.open("http://www.baidu.com/", "_blank","fullscreen=yes");

newWindow.opener = null;

兩種情況：

瀏覽器內(nèi)置的屏蔽程序阻止的彈出窗口，window.open() 返回null，只要檢測(cè)這個(gè)值即可；

瀏覽器擴(kuò)展或其他程序阻止的彈出窗口，window.open() 拋出錯(cuò)誤，則需要把 window.open() 封裝在一個(gè) try-catch 塊中；

對(duì)于第一種：

var popWin = window.open("http://www.baidu.com/","_blank");
if (popWin == null){
    console.log("the popup was blocked by explorer!")
}

如果 popWin 被瀏覽器內(nèi)置的屏蔽程序阻止了，檢測(cè)到 popWin 的值為 null；

對(duì)于第二種：

var blocked = false; //預(yù)設(shè)彈出窗口沒有被屏蔽

//try-catch 代碼塊開始
try {
    var popWin = window.open("http://www.baidu.com/","_blank");
    if (popWin == null){
        blocked = true; //如果值為null，說明被瀏覽器內(nèi)置屏蔽程序屏蔽
    }
} catch(ex){
    blocked = true; //如果收到錯(cuò)誤，說明被瀏覽器屏蔽插件屏蔽
}
//try-catch 代碼塊結(jié)束

//如果被屏蔽，返回字符串提示
if (blocked){
    console.log("the popup was blocked!")
}

JavaScript 是單線程語言。一個(gè)是在指定的時(shí)間后執(zhí)行代碼，另一個(gè)是每隔指定的時(shí)間就執(zhí)行一次代碼。

接收兩個(gè)參數(shù)，一個(gè)是要執(zhí)行的代碼，一個(gè)是以毫秒為單位的時(shí)間。如：

setTimeout("document.write("running!")", 1000);

setTimeout(function(){
    document.write("running it!")
}, 2000);

由于傳遞字符串會(huì)導(dǎo)致性能問題，因此不建議用字符串作為第一個(gè)參數(shù)。

另外，JavaScript 有一個(gè)任務(wù)列隊(duì)，如果列隊(duì)是空的，添加的代碼會(huì)立即執(zhí)行；如果列隊(duì)不是空的，那么要等到前面的代碼執(zhí)行完了以后再執(zhí)行。

調(diào)用setTimeout()方法后，該方法會(huì)返回一個(gè)調(diào)用 ID。這個(gè)超時(shí)調(diào)用 ID 是計(jì)劃執(zhí)行代碼的唯一標(biāo)識(shí)符，可以通過它來取消超時(shí)調(diào)用。如：

var x = setTimeout(function(){
    document.write("running it!")
}, 3000);

setTimeout(function(){
    clearTimeout(x)
}, 2000); //因?yàn)樵?秒鐘的時(shí)候把 x 超時(shí)調(diào)用取消了，所以 3 秒后的超時(shí)調(diào)用則不會(huì)出現(xiàn)。

參數(shù)仍然是兩個(gè)，一個(gè)是指定的執(zhí)行代碼，另一個(gè)是間歇時(shí)間。如：

setInterval("document.write("running!")", 1000);

setInterval(function(){
    document.write("running it!!!")
}, 1500);

同樣的，調(diào)用該方法會(huì)返回一個(gè)間歇調(diào)用ID。使用clearInterval()停止：

var list = [32,14,21,34,254,3,25,4315,43,654,36,5431,1];
var num = 0;

var x = setInterval(showList, 100);
function showList(){
    console.log(list[num]);
    num ++;
    if (num == list.length){
        clearInterval(x)
        console.log("done!")
    }
}

如上，以 100 毫秒的速度遍歷所有 list 的值。

也可以使用超時(shí)調(diào)用來實(shí)現(xiàn)，如：

var list = [32,14,21,34,254,3,25,4315,43,654,36,5431,1];
var num = 0;

setTimeout(showList, 100);

function showList(){
    console.log(list[num]);
    num ++;
    if (num < list.length){
        setTimeout(showList, 100);
    }else{
        console.log("done!");
    }
}

最好使用超時(shí)調(diào)用來模擬間歇調(diào)用。

一個(gè)字符串參數(shù)，并將其顯示給用戶。

一個(gè)字符串參數(shù)，并將其顯示給用戶，提供兩個(gè)按鈕，一個(gè) Ok 按鈕返回布爾值 true；另一個(gè)按鈕 Cancel 返回布爾值 false。

一個(gè)“提示框”，接收連兩個(gè)參數(shù)： 要顯示給用戶的文本提示和文本輸入域的默認(rèn)值（可以為空字符串）。

如：

var str = prompt("insert your name here", "");
if (str.length > 0){
    alert("welcome " + str);
    var result = confirm("would you want something to drink ?");
    if (result){
        document.write("please wait");
    }else{
        document.write("have a seat");
    }
}else {
    alert("can not define");
}