一、打開窗口open
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>打開窗口</title>
<script type="text/javascript">
window.onload=function()
{
var oBtn=document.getElementById('btn1');
oBtn.onclick=function()
{
window.open('http://www.miaov.com/','_self');//第一個(gè)參數(shù)是要打開的頁(yè)面地址 第二個(gè)參數(shù)是在哪個(gè)框架里面打開
}
}
</script>
</head>
<body>
<input id="btn1" type="button" value="開窗口"/>
</body>
</html>
二、關(guān)閉窗口close
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>關(guān)閉窗口</title>
<script type="text/javascript">
window.onload=function()
{
var oBtn=document.getElementById('btn1');
oBtn.onclick=function()
{
window.close();
}
}
</script>
</head>
<body>
<input id="btn1" type="button" value="關(guān)閉"/>
</body>
</html>
三、系統(tǒng)對(duì)話框
警告框：alert（“內(nèi)容”），沒(méi)有返回值
選擇框：confirm（“提問(wèn)的內(nèi)容”），返回boolean
輸入框：prompt()，返回字符串或null
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>系統(tǒng)對(duì)話框</title>
<script type="text/javascript">
//alert('abc');
//confirm('吃飯了嗎');
var str=prompt('請(qǐng)輸入你的姓名','blue');
alert(str);
</script>
</head>
<body>
</body>
</html>
四、常用屬性
window.navigator.userAgent?????告訴當(dāng)前瀏覽器版本
window.location?????彈出當(dāng)前頁(yè)面地址
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>location</title>
<script type="text/javascript">
alert(window.location);
//window.location='http://www.miaov.com/'
</script>
</head>
<body>
</body>
</html>
五、window對(duì)象常用事件
onload:保證打開后的樣式和剛打開時(shí)一樣
onscroll
onresize:窗口變小和窗口不變時(shí)一致。例如：回到頂部按鈕，側(cè)邊欄廣告，閃爍問(wèn)題等。
<meta charset="utf-8">
<title>側(cè)邊欄廣告</title>
<style type="text/css">
#div1 {width:100px;height:100px;background:red;position:absolute;right:0;} /*紅色塊到右邊*/
</style>
<script type="text/javascript">
window.onresize= window.onload=window.onscroll=function()//紅色塊始終在右邊居中顯示
{
var oDiv=document.getElementById('div1');
var scrollTop=document.documentElement.scrollTop||document.body.scrollTop;//可視區(qū)到達(dá)頁(yè)面頂端的距離
var t=(document.documentElement.clientHeight-oDiv.offsetHeight)/2;//紅塊距離可視區(qū)頂部的位置
oDiv.style.top=scrollTop+t+'px';
}
</script>
</head>
<body style="height:2000px;">
<div id="div1">
</div>
</body>
</html>
