知识总结：
<pre>
浏览器对象模型BOM：将浏览器常用方法封装进window对象，对外供js调用
具体实现：window对象
</br>
1.window对象的常用方法：
--框体方法：
alert():警告框
confirm():确认框。点击确定返回true，点击取消返回false
prompt("提示语","默认值"):提示框。点击确定返回当前值，点击取消返回null
</br>
--定时执行和间隔执行：
setTimeOut(要执行的函数,时间)：指定时间后开辟线程执行指定函数，返回线程id
setInterval(要执行的函数，时间)：每隔指定时间开辟一个线程执行指定的函数，返回线程id
clearInterval(id)：关闭指定的interval开启的线程
clearTimeout(id)：关闭指定的timeout开启的线程
</br>
--子页面方法：
open():使用此方法可以打开当前页面的子页面，使用以下属性设置子页面窗口的大小，位置，及显示选项height=400,width=600,top=200,left=400,tooibar=yes,menubar=yes,scrollbars=no,resizable=yes,location=yes,status=yes
close():在子页面中使用此方法，关闭使用open打开的子页面。
</br>
注意:open（父页面中声明）和close（子页面中声明）需要配套使用，否则close不奏效，即子页面调用close方法的前置条件是：子页面是由父页面使用open方法打开的
</br>
--重要的属性：
opener：window.opener.父页面函数名
使用opener调用父页面的函数。
</br>
2.window属性学习
--screen：获取客户端信息
width：获取屏幕的宽度分辨率
height：获取屏幕的高度分辨率
availWidth：可用宽度
availHeight：可用高度
</br>
--location：地址栏属性
href：可以获取和修改当前地址栏URL信息
reload()：刷新当前页面
</br>
--history：历史记录属性
forward()：相当于浏览器的前进按钮
backward()：相当于浏览器的后退按钮
go()：前进或后退到指定历史记录，正整数表示前进，负整数表示后退，0表示自己
</br>
--navigator：浏览器版本信息属性
userAgent：获取当前浏览器的版本信息
</pre>
代码示例：
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
function myScreen(){
var screen=document.getElementById("screen");
screen.innerHTML="分辨率："+window.screen.height+"*"+window.screen.width+"<br>"+
"可用分辨率："+window.screen.availHeight+"*"+window.screen.availWidth;
}
function myNavigator(){
var nav=document.getElementById("navigator");
nav.innerHTML="浏览器版本信息："+window.navigator.userAgent;
}
/*警告框*/
function myAlert(){
window.alert("Alert Frame");
}
/*确认框*/
function myConfirm(){
var flag=window.confirm("Confirm Frame");
window.alert("show flag:"+flag);
}
/*提示框*/
function myPrompt(){
var flag=window.prompt("Prompt Frame","default value");
window.alert("show flag:"+flag);
}
/*使用setTimeOut动态获取当前系统时间*/
function mySetTimeOut(){
var date=new Date();
var h=date.getHours();
var m=date.getMinutes();
var s=date.getSeconds();
var current=h+":"+m+":"+s;
var span=document.getElementById("myspan");
span.innerHTML=current;
window.setTimeout(mySetTimeOut,1000);
}
var id;
/*使用setInterval制造流氓提示框*/
function mySetInterval(){
id=window.setInterval(function(){
alert("就是想看你灭不掉我的样子");
},4000);
}
/*使用clearInterval关闭setInterval开启的线程。clearTimeOut同。*/
function myClearInterval(){
alert(id);
window.clearInterval(id);
}
function myOpen(){
window.open("ad.html","son","height=200px,width=400px,top=200px,left=300px");
}
function myOpener(){
window.location.reload();
window.alert("页面已刷新");
}
</script>
</head>
<body onload="mySetTimeOut();mySetInterval();myOpen();myScreen();myNavigator();">
<p>
<span id="screen">
</span>
</p>
<p>
<span id="navigator">
</span>
</p>
<p>
<input type="button" name="" id="" value="测试警告框" onclick="myAlert();" />
<input type="button" name="" id="" value="测试确认框" onclick="myConfirm();" />
<input type="button" name="" id="" value="测试提示框" onclick="myPrompt();" />
</p>
<p>
<input type="button" name="" id="" value="一键消灭流氓警告框" onclick="myClearInterval();" /><br />
</p>
<p>
<span id="myspan"></span>
</p>
</body>
</html>
网友评论