javascript學習筆記——BOM的物件：window（核心）、location、history
1.window物件
1.1 全域性作用域
BOM的核心物件是window，它表示瀏覽器的例項；
在瀏覽器中，window物件既是通過js訪問瀏覽器視窗的一個介面，又是ES規定的Global物件；
所有在全域性作用域中宣告的變數、函式都會變成window物件的屬性和方法
全域性變數不能通過delete操作符刪除，而未宣告直接賦值或者是在window物件直接定義的屬性可以；
嘗試訪問未宣告的變數會丟擲錯誤，但是通過查詢window物件，可以知道某個可能未宣告的變數是否存在；
var globalval=1; function test(){ localval=2; } window.globalval1=3; delete.globalval; //false delete.localval; //true delete.globalval1; //true
1.2視窗關係及框架
如果頁面中包含框架（<frame>），則每個框架都包含一個window物件，並且儲存在frames集合中，在該集合中可以通過數值索引（從0開始、從左到右、從上到下）或者框架名稱來訪問相應的window物件.。
每個window物件都有一個name屬性，其中包含框架的名稱；除非最高層的視窗是通過window.open()開啟的，否則window物件的name屬性不會包含任何值；
window.frames[0];
window.frame["topFrame"];
//<=>
top.frames[0];window物件指向的是那個框架的特定例項，而非最高層的框架；
top物件始終指向最高層的框架，即瀏覽器視窗；
parent物件始終指向當前框架的直接上層框架
在沒有框架的情況下，parent物件等於top物件等於window物件；
self物件，始終指向window物件；
訪問物件：window.top window.parent window.self
在使用框架的情況下，瀏覽器中會存在多個Global物件，每個框架中定義的全域性變數會自動成為框架中window的屬性；
1.3視窗位置
表示視窗相對於螢幕左邊和上邊的位置，IE、Safari、Opera、和Chrome瀏覽器中用screenLeft和screenTop屬性表示；Firefox瀏覽器用screenX和screenY屬性表示；
//跨瀏覽器取得視窗左邊和上邊的位置
var leftPos=(typeOf window.screenLeft=="number")?window.screenLeft:window.screenX;
var topPos=(typeOf window.screenTop=="number")?window.screenTop:window.screenY;將視窗精確移動到一個新位置的方法；
moveTo(x,y) 新位置的x，y座標
moveBy(x,y) 表示的是在水平和垂直方向上移動的畫素數
這兩個方法可能會被瀏覽器禁用（Opera和IE7預設禁用），還有就是這兩個方法不適用於框架，只能對最外層的window物件使用
//將視窗移動到螢幕左上角
window.move(0,0);
//將視窗向下移動100畫素
window.moveBy(0,100);1.4視窗大小
由於各個瀏覽器對於視窗大小獲取方式在各有不同，在標準模式和混雜模式下也有所不同，因此無法瀏覽器視窗本身的大小，但是可以取得視口的大小，程式碼實現見P198頁
clientWidth:視口的寬度
clientHeight:視口的高度
調整瀏覽器視窗大小的方法：
resizeTo(x,y) x,y表示瀏覽器視窗的新寬度和新高度
resizeBy(x,y) x.y接收新視窗與原視窗的寬度和高度之差
這兩個方法可能會被瀏覽器禁用（Opera和IE7預設禁用），還有就是這兩個方法不適用於框架，只能對最外層的window物件使用
//調整到100*100
window.resizeTo(100,100);
//調整到200*100
window.resizeBy(100,50);1.5導航和開啟視窗
window.open()方法既可以導航到一個特定的URL，也可以開啟一個新的瀏覽器視窗；
window.open(要載入的URL，視窗目標，特定字串，表示新頁面是否取代瀏覽器歷史記錄中當前載入頁面的布林值)，返回的是新視窗的引用；
通常只需傳遞第一個引數，最後一個引數只在不開啟新視窗的情況下使用；
如果有第二個引數，則該引數是已有視窗或框架的名稱；特殊的視窗名稱也可以是：_self，_parent，_top，_blank
//等同於 <a href="http://www.wrox.com" target="topFrame"></a>
window.open("http://www.wrox.com","topFrame");如果不是一個已經存在的視窗或框架，則可以設定第三個引數，該引數是用於定義新視窗顯示哪些特性，如果沒有參入第三個引數，那麼開啟的新視窗或框架將是預設設定的；在不開啟新視窗的情況下，會忽略第三個引數；
該引數是一個用逗號分隔的設定字串。整個特性字串不允許出現空格；
var=wroxWin=window.open("http://www.wrox.com","wroxWindow","height=400,width=400,top=10,left=10,resizeable=yes");
//調整新視窗的大小
wroxWin.resizeTo(500,500);
//移動位置
wroxWin.moveTo(100,100);
//關閉新開啟的視窗
wroxWin.close();close()僅僅適用於通過open方法開啟的彈出視窗
瀏覽器的主視窗如果沒有使用者的允許是不能關閉的，呼叫top.close()可以在不經過使用者允許的情況下關閉自己；
視窗關閉之後引用還在,可以通過 wroxWin.closed 測試引用是否還在，返回true說明引用還在；
wroxWin.opener儲存著開啟它的原始視窗物件；
var=wroxWin=window.open("http://www.wrox.com","wroxWindow","height=400,width=400,top=10,left=10,resizeable=yes");
wroxWin.opener=null;opener屬性設定為null就是告訴瀏覽器新建立的標籤頁不需要與開啟它的標籤頁通訊，因此可以獨立的程序中執行。標籤頁之間的聯絡一旦切斷，將沒有辦法恢復。
大多數瀏覽器都內建有彈出視窗遮蔽程式，沒有也可以安裝程式擴充套件；
1）如果是瀏覽器內建的遮蔽程式阻止的彈出視窗，那麼window.open()很可能會返回null；
2）如果是瀏覽器擴充套件或其他程式阻止的彈出視窗，那麼window.open()通常會丟擲一個錯誤；
要在任何情況下都能檢測開啟的彈出視窗是否被遮蔽，則程式碼應如下:
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");
}1.6間歇呼叫和超時呼叫
JavaScript是單執行緒語言，一定時間內只能執行一段程式碼，因此有一個JavaScript任務佇列，這些任務會按照它們新增到佇列的順序執行。
js允許設定超時值和間歇時間值來排程程式碼在特定的時刻執行：
1）在指定的時間過後執行程式碼；
2）每個指定時間執行一次程式碼；
1）超時呼叫的方法：
setTimeout(a,b);
a 指的是一個包含js程式碼的字串 或者 一個函式 （不建議是字串，因為可能導致效能損失）
b 指的是等待的時間，單位是毫秒，告訴javascript在過多長時間把當前任務新增到佇列中，如果佇列是空，新增的程式碼立即執行，否則要等前面的程式碼執行完以後再執行，也就是說經過該時間後指定的程式碼不一定會執行；
該方法會返回一個數值ID，表示超時呼叫，可以通過它來取消超時呼叫；
要取消未執行的超時呼叫計劃，可以呼叫clearTimeout(),將setTimeout返回的數值ID作為引數，舉例如下：
//設定超時呼叫
var timeoutId=setTimeout(function(){
alert("hello world");
},1000);
//取消超時呼叫
clearTimeout(timeoutId);2）間歇呼叫的方法：
按照指定的時間間隔重複執行程式碼，直到間歇呼叫被取消或者頁面解除安裝；
setInterval(a,b)
a 指的是一個包含js程式碼的字串 或者 一個函式 （不建議是字串，因為可能導致效能損失）
b 指的是每次執行之前需要等待的毫秒數；每隔一個時間開始執行時，前一個程式碼有可能還沒執行完
該方法返回一個間歇呼叫ID，通過clearInterval(間歇ID),可以取消未執行的間歇呼叫；
取消間歇呼叫是很重要的，否則間歇呼叫將會一直執行到頁面解除安裝
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++;
if(num<=max){
setTimeout(argument.callee,500);
}else{
alert("done");
}
}在超時呼叫的時候沒有必要跟蹤超時呼叫的ID，因為每次執行完程式碼之後，如果不在設定另一次超時呼叫，呼叫就會自行停止。
一般認為，使用超時呼叫來模擬間歇呼叫的一種最佳模式，能不用最好不用
在開發環境下，很少使用真正的間歇呼叫，原因是後一個間歇呼叫可能會在前一個間歇呼叫結束之前啟動；
1.7系統對話方塊
系統對話方塊與瀏覽器中顯示的網頁沒有關係，也不包含HTML。他們的外觀由作業系統及瀏覽器設定決定，而不是css決定；
在顯示對話方塊的時候頁面中的程式碼會停止執行，而關掉這些對話方塊後代碼繼續執行；
呼叫對話方塊的方法有：alert()，confirm()，prompt()
//警告框
alert("警告框");
//“確認”對話方塊，可以讓使用者決定是否執行給定操作
if(confirm("are you sure?")){
alert("sure");
}else{
alert("cancel");
}
//“提示”對話方塊
var res=prompt("what is your name","");
if(res!=null){
alert("welcome,"+res);
}2.location物件
1）Location物件提供了與當前視窗中載入的文件有關的資訊和一些導航功能；
2）它既是window物件的屬性，也是document物件的屬性。即，window.location和document.location引用的是同一個物件
3）用處： 儲存著當前文件的資訊；
將URL解析為獨立的片段；
4）location物件的屬性：(這些屬性操作都會在瀏覽器的歷史記錄中生成一條記錄)
5）改變瀏覽器位置的方法：
location.assign("http://www.wrox.com");
window.location("http://www.wrox.com");
location.href("http://www.wrox.com"); //最常用6）設定新值改變URL
每次修改location的屬性（hash除外），頁面都會以新URL重新載入
//假設初始URL為http://www.wrox.com/WileyCDA/
//修改為http://www.wrox.com/WileyCDA/#section
location.hash="#section";
//修改為http://www.wrox.com/WileyCDA/?q=javascript
location.search="?q=javascript";
7）replace()可以禁用瀏覽器的“後退”行為，這個方法接收一個URL導航到一個地址，使得瀏覽器的位置改變，但不會再歷史記錄中生成新的記錄；
location.replace("http://www.wrox.com");8) 重新載入當前頁面：reload()方法
reload()呼叫之後的程式碼可能會也可能不會執行，最好將reload()放在程式碼的最後一行；
location.reload(); //重新載入（有可能從快取中載入）
location.reload(true); //重新載入（從伺服器重新載入）3.history物件
history儲存著使用者上網的歷史記錄
每個瀏覽器視窗、每個標籤頁、每個框架，都有自己的history物件與特定的window物件關聯
1）使用go()方法可以在使用者的歷史記錄中任意跳轉，可以向後也可以向前
//後退一頁
history.go(-1);
//前進一頁
history.go(1);
//前進兩頁
history.go(2);
//跳轉到最近的wrox com頁面，是歷史記錄中包含該字串的第一個位置，可能後退也可能前進，要看哪個最近
history.go("wrox.com");2）back() 模仿瀏覽器“後退”
forward() 模仿瀏覽器“前進”
//後退一頁
history.back();
//前進一頁
history.forward();3）length屬性，儲存著歷史記錄的數量
history.length;