BOM也叫浏览器对象模型,他提供了很多对象,用于访问浏览器的功能。
一、Windows对象
BOM的核心对象,他表示浏览器的一个实例,Windows对象处于JavaScript结构的最顶层,对于每个打开的窗口,系统都会自动为其定义Windows对象。
1、属性
window对象有一系列的属性,这些属性本身也是对象。
Closed/defaultStatus/document/frames/history/length/location
2、方法
这些属性和方法都可以使用window.属性、window.方法或直接属性、方法()的方式调用。
比如:
Windows.alert()和alert()是一个道理
3、系统对话框
浏览器通过alert()、confirm()和prompt()方法调用系统对话框向用户显示信息,系统对话框与浏览器中显示的网页没有关系,也不包含HTML。
1、alert('Lee');
2、confrim('请确定或者取消');
3、 if (confirm('请确定或取消')){
alert('您按了确定');
}else{
alert('您按了取消');
}
4、var num=prompt('请输入一个数字',0) //两个参数,一个提示,一个值
alert(num);
4、新建窗口
使用Windows.open()方法可以导航到一个特定的URL,也可以打开一个新的浏览器窗口。
它可以接受四个参数:
1.要加载的URL
2.窗口的名称或窗口目标
3.一个特性字符串
4.一个表示新页面是否取代浏览器记录中当前加载项页面的布尔值
open('http://www.baidu.com','_parent');
5、窗口的位置和大小
6、间歇调用和超时调用
超时调用:
需要用到Windows对象的setTimeout()方法,它接受两个参数:要执行的代码和号民书的超时时间。
举例:
1、直接传入函数名
function box(){
alert('Lee');
}
setTimeout(box,1000);
2、推荐做法
setTimeout(function(){
alert('Lee');
},1000);
要取消尚未执行的超时调用计划,可以调用clertTimeout()方法,并将相应的超时调用ID作为参数传递给它。
var box=setTimeout(function(){
alert('Lee');
},1000); //赋值给box
clearTimeout(box); //取消
间歇调用:
方法是setInterval(),它接受的参数与setTimeout()相同:要执行的代码和每次执行之前需要等待的毫秒数。
setInterval(function(){ //重复不停的执行
alert('Lee');
},1000);
取消间歇调用:
var box=setInterval(function(){
alert('Lee');
},1000);
clearInterval(box);
具体实例:设置一个5s的定时器
varnum=0;
var max=5;
setInterval(function(){
num++;
if(num==max){
clearInterval(this);
alert('5s后了');
}
},1000);
但是,上面的间歇调用一般不会用到,因为还得取消,可能造成同步的一些问题,我们一般使用超时调用。
var num=0;
var max=5;
function box(){
num++;
if(num==max){
alert('5s了');
}else{
setTimeout(box,1000);
}
}
setTimeout(box,1000);
二、Location对象
提供了与当前窗口中加载的文档有关的信息,还提供了一些导航功能。其实他是windows对象的属性,也是document对象的属性,所以Windows.location和document.location等效。
alert(location) //获取当前的URL
在开发中,我们经常需要获取诸如?Id=5&search=ok这样类型的URL的键值对,那么通过location,我们可以写一个函数,来一一获取。
function getArgs(){
//创建一个存放键值对的数组
var args=[];
//去除?号
varqs=location.search.length>0?location.search.substring(1);'';
//按&字符串拆分数组
var items=qs.split('&');
varitem=null,name=null,value=null;
三、history 对象
他是window对象的属性,保存用户上网的记录
function back(){ //跳转到前一个URL
history.back();
}