您的位置:首页 > 其它

BOM(浏览器对象模型)对象总结

2017-06-29 20:20 435 查看
1.window对象

BOM的核心对象是window,它表示浏览器的一个实例,它也是ECMAScript规定的Globle对象,也就是说网页中任何一个对象都是在window这个对象里面的。如果有用到框架(frameset),那么每个框架都有自己的window对象.

如下例子:

var  a = "666";

aler(a);  //666
alert(window.a)  //666


两条alert都是弹出相同的结果。

Window 对象表示一个浏览器窗口或一个框架。在客户端 JavaScript 中,Window 对象是全局对象,所有的表达式都在当前的环境中计算。也就是说,要引用当前窗口根本不需要特殊的语法,可以把那个窗口的属性作为全局变量来使用。例如,可以只写document,而不必写 window.document,同样,可以把当前窗口对象的方法当作函数来使用,如只写 alert(),而不必写 Window.alert()
window 对象常用方法
1、alert()   显示带有一段消息和一个确认按钮的警告框
2、setTimeout(code,millisec)  //  指定millisec时间后执行一次code,这个最常用在写时钟
clearTimeout(id)  //  停止执行setTimeout 所调用的方法
3、setInterval(code,millisec) //  周期性执行调用code代码串  返回一个clearInterval() 从而取消对 code 的周期性执行的值。
clearInterval(id)  //clearInterval() 方法可取消由 setInterval() 设置的 timeout


<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script language="javascript" type="text/javascript">
var cid=self.setInterval("clock()",50)
function clock(){
document.getElementById("btn").value=new Date;
}
</script>
</head>
<body>
<input id="btn" type="button" name="test" onclick="clearInterval(cid)">
</body>
</html>


4、closed()   关闭浏览器窗口
5、moveBy(x,y)   把窗口右移x像素 下移y像素
6、moveTop(x,y)       把窗口左上角移动到制定位置


<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script language="javascript" type="text/javascript">
var win = window.open("http://www.baidu.com","新窗口","width:500,height:300");
function move(){
win.moveBy(50,50);
}
</script>
</head>
<body>
<input id="btn" type="button" name="test" value="移动" onclick="move()">
</body>
</html>


7、open(URL,name,features)  用于打开一个新的浏览器窗口或查找一个已命名的窗口,URL为打开地址,name窗口名称, features属性值:

8、print() 方法用于打印当前窗口的内容,调用本地打印设备


2.location对象

提供了与当前窗口中加载的文档有关的信息,还有一些导航功能,值得注意的是location既是window对象的属性,又是document对象的属性,既window.location和document.location 引用的是同一个对象。

比较实用的方法是location.assign();

window.location = "http://www.666.com";    //页面跳转到该网址
location.href = "http://www.666.com";      //页面跳转到该网址
location.assign("http://www.666.com");     //页面跳转到该网址


前两种方法其实底层也是调用了location.assign(),即三者结果是一样的。

注:这三种方法跳转之后可以通过后退按钮返回到跳转之前的页面。

location.replace("http://www.666.com");   //页面跳转到该网址,跳转之后不可返回前一页面


3.navigator对象

该对象里面保存着浏览器的各种信息,判断浏览器的各种信息就是从该对象里的属性来读取,具体属性如下图:



cookicEnablcd:判断是否启用cookic

userAgent:判断浏览器的名称和版本号

plugins:保存浏览器中所有插件信息的集合

4.screen对象

目前没遇到用screen对象的场景,所以就不在此介绍。如果有什么神奇的作用还请大腿评论告知。

5.history对象

该对象保存着用户上网的历史记录,从窗口被打开的那一刻算起。出于安全考虑,开发人员不能知道用户浏览过的网址的具体url,但是我们可以通过下面方法在不知道具体历史url的情况下控制用户页面前进或后退。

history.go(-1);   //页面后退一页
history.go(1);    //页面前进一页
history.go(0):刷新
<a href="javascript:history.go(1);">前进一次</a>
history.go("666");   //跳转到距当前页面最近的包含666字符串的页面,可能前进可能后退。

//下面这两个方法对应history.go()的前进和后退。
history.back(1);  //后退一页
history.forward(1)  //前进一页
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  对象