?? BOM是Browser Object Model的縮寫,即瀏覽器對象模型,提供了獨立于網頁內容和瀏覽器窗口之間進行交互的APi。API由若干對象組成,由于瀏覽器是Javascript的宿主,因此,這些對象也稱為宿主對象。
## 一、定時器--間隔調用和延遲調用
?? 1、setInterval()和clearInterval()方法實現間隔調用(循壞調用)
???????? setInterval(code,millisec[,"lang"]):按照指定的周期(以毫秒計)來調用函數或計算表達式,直到 clearInterval() 被調用或窗口被關閉。返回一個可以傳遞給 Window.clearInterval() 從而取消對 code 的周期性執行的值。
????????? code:必須,要調用的函數或要執行的代碼串。調用函數傳入函數名或者創建匿名函數。
????????? millisec:必須,間隔調用的時間,以毫秒為單位。
????????? lang:可選,用于定義傳遞給函數的任意數量的參數。
????????? 若要用clearInterval()方法取消setInterval()方法調用,就必須將setInterval的返回值賦給一個變量給clearInterval調用。
~~~
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<style type="text/css">
#div1
{
width: 150px;
height: 125px;
border: 1px dashed #ccc;
}
</style>
</head>
<body>
<div id="div1">
</div>
<button onclick="javascript:clearInterval(cancel)">
Stop interval</button>
<script type="text/javascript">
var iCount = 0;
var text = "setInterval()函數正在運行...";
var divText = "";
var oDiv = document.getElementById("div1");
function print () {
divText += text[iCount];
oDiv.innerHTML = divText;
iCount++;
}
var cancel = setInterval(print,1000);
</script>
</body>
</html>
~~~
結果:


?? 2、setTimeout()和clearTimeout()方法實現延遲調用
???????? setTimeout(code,millisec):用于在指定的毫秒數后調用函數或計算表達式,只執行 code 一次,不循環調用,如果要多次調用,請使用 setInterval() 或者讓 code 自身再次調用 setTimeout()。參數同setInterval。
???????? 若要用clearTimeout()方法取消clearTimeout()方法調用,就必須將setTimeout()的返回值賦給一個變量給clearTimeout()調用。
~~~
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<style type="text/css">
#div1
{
width: 150px;
height: 125px;
border: 1px dashed #ccc;
}
</style>
</head>
<body>
<div id="div1">
2秒鐘后出現其他內容
</div>
<button onclick="javascript:clearInterval(cancel)">
Stop interval</button>
<script type="text/javascript">
var text = "setTimeout()函數正在運行...";
var oDiv = document.getElementById("div1");
function print () {
oDiv.innerHTML = text;
}
var cancel = setTimeout(print,2000);
</script>
</body>
</html>
~~~
結果:


?? 3、強制清除:沒有一個內建的方法可以一次清除所有的setInterval()或者setTimeout(),因此要采用循環清除:
????? for(var i = 0; i < 10; i++) clearTimeout(i);
## 二、基本的交互操作
?? 1、alert(msg):警告對話框,msg是要顯示的文本字符串,包含的HTML原樣顯示。
?? 2、confirm(msg):確認對話框,參數同alert;方法返回TRUE(“確定”)或者FALSE(“取消)。
?? 3、prompt(msg[,input]):提示輸入消息對話框,msg同alert,input可選,定義在文本框中顯示的信息,不定義input,則為空。prompt()方法以字符串或者整數返回用戶輸入的信息。按取消按鈕返回null
?? 4、showModalDialog(URL[,arg]);打開一個新窗口類型的對話框,可以加載一個網頁(但是不能刷新)。URL是加載網頁的URL地址,arg是傳遞給窗口的參數。部分瀏覽器默認阻止彈出這個窗口,需要設置允許彈出新窗口。該方法有返回值。
?? 5、print():打印當前文檔。
~~~
var returned = confirm("你是SB嗎?");
if(returned)
{
?document.write("你是SB<br/>");
}
else
{
?document.write("你不是SB<br/>");
}
var value = prompt("你多少歲?",100);
document.write("你是"+value+"歲<br/>");
showModalDialog("http://blog.csdn.net/u011043843");
~~~

## 三、窗口交互操作
?? 1、window.open():打開一個新的瀏覽器窗口或查找一個已命名的窗口。返回新窗口的引用。

features的可選值:

~~~
<html>
<head>
<script type="text/javascript">
function open_win()
{
window.open("http://www.w3school.com.cn")
}
</script>
</head>
<body>
<input type=button value="Open Window" onclick="open_win()" />
</body>
</html>
~~~
?? 2、window.close([arg]):關閉窗口,arg是窗口的引用,未定義arg,則關閉當前窗口。
?? 3、window.stop():取消文檔的加載。
?? 4、獲取窗口引用:window[index] 或 window[name]:根據索引或者名稱獲取window對象,屬性如下:

?? 5、window.blur()和window.focus():分別使窗口失去焦點和獲取焦點,并觸發onblur和onfocus事件。
## 四、HTML5 中新增的幾個屬性
??? 1、window.locationbar.visible:是一個布爾值,定義地址欄是否可見
??? 2、window.menubar.visible:是一個布爾值,定義菜單欄是否可見
??? 3、window.personalbar.visible:是一個布爾值,定義個人欄是否可見
??? 4、window.scrollbars.visible:是一個布爾值,定義滾動欄是否可見
??? 5、window.statusbar.visible:是一個布爾值,定義狀態欄是否可見
???6、window.toolbar.visible:是一個布爾值,定義工具欄是否可見
- 前言
- 一
- 二:變量
- 三:數據運算
- 四:流程控制
- 五:內建的全局函數
- 六:自定義函數
- 七:面向對象編程(OOP)
- 八:靜態成員、靜態類、枚舉、重載和覆蓋
- 九:原型鏈本質論
- 十:ECMAScript 5 增強的對象模型
- 十一:處理字符串---String類和正則表達式
- 十二:數組、多維數組和符合數組(哈希映射)
- 十三:處理日期和時間
- 十四:JavaScript內建類
- 十五:BOM之源---window對象
- 十六:BOM之源---BOM基本應用
- 十七:BOM新成就(1)--客戶端存儲數據(Storage實現)
- 十八:BOM新成就(1)--客戶端存儲數據(Web SQL DataBase實現)
- 十九--HTML5 DOM新標準---處理文檔元信息和管理交互能力
- 二十---XMLHttpRequest和AJAX解決方案