ECMAScript是JavaScript的核心,但在web使用JavaScript,那么BOM(瀏覽器對象模型)才是真正的核心。
BOM的核心對象是window,它表示瀏覽器的一個(gè)實(shí)例。
在瀏覽器中,window對象既是JavaScript訪問瀏覽器窗口的一個(gè)接口,又是ECMAScript規(guī)定的Global對象。也就是說,在網(wǎng)頁中定義的任何一個(gè)變量、對象和函數(shù)以window作為其Global對象。
具體操作可到下面查詢
<h3>1.window對象</h3>
<h6>window常用方法</h6>
open(): 在一個(gè)窗口中打開頁面
setInterval(): 設(shè)置定時(shí)器(執(zhí)行n次)
setTimeout(): 設(shè)置定時(shí)器(只執(zhí)行1次)
clearInterval(): 清除定時(shí)器
clearTimeout(): 清除定時(shí)器
alert(): 提示框
confirm(): 確認(rèn)提示框
propmt(): 輸入提示框</br>
注意:因?yàn)閣indow對象使用非常頻繁,所以當(dāng)調(diào)用js中的window對象的方法時(shí),可以省略對象名不寫。
<style type="text/css">
input{
margin-top:10px;
}
</style>
<script type="text/javascript">
function testAlert(){
window.alert("測試alert");
}
/*
參數(shù)1:dialog中顯示的內(nèi)容
參數(shù)2,3:可點(diǎn)擊的按鈕(默認(rèn)沒有就是"ok","cancle")
返回值: ok->true cancle->false
*/
function testConfirm(){
var flag;
flag = window.confirm("你這是在作死你知道嗎?","知道","不知道");
if (flag)
window.alert("知道你還作死?");
else
window.alert("你注定死無全尸!");
}
/*
參數(shù)1:可以是一個(gè)資源地址(圖片,本地地址...)
參數(shù)2:target of links
參數(shù)3:窗口特點(diǎn)......
*/
function testOpen (){
window.open("http://www.baidu.com","_blank","height=400px,width=400px,left=10px");
}
/*
參數(shù)1:定時(shí)器要執(zhí)行的方法
參數(shù)2:定時(shí)器時(shí)間
*/
var intervalID;
function testInterval (){
intervalID = window.setInterval("testOpen()",2000);//2秒彈一個(gè)廣告
}
/*
參數(shù)1:定時(shí)器要執(zhí)行的方法
參數(shù)2:定時(shí)器時(shí)
*/
var timeoutID;
function testTimeout(){
timeoutID = window.setTimeout("testOpen()",1000);
}
/*
參數(shù)1:提示語
返回值:在輸入框中輸入的內(nèi)容
*/
function testPrompt(){
var str;
str = window.prompt("請輸入您上的銀行卡密碼:");
window.alert("您剛才輸入了:"+str);
}
/*清除兩個(gè)定時(shí)器*/
function clearInterval(){
window.clearInterval(intervalID);
}
function clearTimeout(){
window.clearTimeout(timeoutID);
}
</script>
</head>
<body>
<input type="button" value="testAlert" onclick="testAlert()" /></br>
<input type="button" value="testOpen" onclick="testOpen()" /></br>
<input type="button" value="testConfirm" onclick="testConfirm()" /></br>
<input type="button" value="testInterval" onclick="testInterval()" /></br>
<input type="button" value="testTimeout" onclick="testTimeout()" /></br>
<input type="button" value="clearInterval" onclick="clearInterval()" /></br>
<input type="button" value="clearTimeout" onclick="clearTimeout()" /></br>
</body>
<h3>2.location對象</h3>
常用方法
***href屬性: ***代表的是地址欄的URL,可以獲取和設(shè)置URL。URL表示統(tǒng)一資源定位符
reload方法: 刷新當(dāng)前頁面
<script type="text/jscript">
function testHref(){
//alert(window.location.href); 顯示當(dāng)前網(wǎng)址
//通過修改location對象的href屬性來實(shí)現(xiàn)頁面的跳轉(zhuǎn)
window.location.;
}
function testReload(){
//刷新當(dāng)前頁面
window.location.reload();
}
</script>
</head>
<body>
<input type="button" value="跳轉(zhuǎn)" onclick="testHref()">
<input type="button" value="刷新" onclick="testReload()">
</body>
3.history對象
常用方法:
forward(); 向前
back();向后
go(n);n為正時(shí)向前n頁,n為負(fù)時(shí)后退n頁
<script type="text/javascript">
function testForward(){
window.history.forward();
}
function testBack(){
window.history.back();
}
function testGo(){
window.history.go(1);
}
function testGo2(){
window.history.go(-1);
}
</script>
</head>
<body>
<input type="button" value="往前" onclick="testForward()"/>
<input type="button" value="退后" onclick="testBack()"/>
<input type="button" value="往前n" onclick="testGo()"/>
<input type="button" value="退后n" onclick="testGo2()"/>
</body>
4.screen對象
<script type="text/javascript">
/*
availHeight和availWidth是排除了任務(wù)欄之后的當(dāng)前屏幕(物理上的)高度和寬度
*/
document.write(window.screen.availWidth + "<br/>");
document.write(window.screen.availHeight + "<br/>");
document.write(window.screen.width + "<br/>");
document.write(window.screen.height + "<br/>");
</script>