BOM是“Browser Object Model”的缩写,简称“浏览器对象模型”。
BOM定义了JavaScript操作浏览器的接口,提供了访问某些功能(如浏览器窗口大小、版本信息、浏览历史记录等)的途径以及操作方法。
BOM只是JavaScript脚本实现的一部分,没有任何相关的标准,W3C也没有对该部分作出规范,每种浏览器都有自己的BOM实现。
Window对象包括DOM(anchors/forms/images/links/location)和BOM(frames/history/location/navigator/screen)。
系统对话框
1.弹出警告
直接弹出警告框。
2.确定和取消
confirm(“请确定或者取消”);
if(confirm(“请确定或者取消”)){
确定返回true
}else{
按取消返回false
};
3.输入带输入提示框
两个参数,一个提示,一个值
得到输入的值
新建窗口
方法可以导航到一个特定的URL,也可以打开一个新的浏览器窗口,一般可以接受三个参数:要加载的url、窗口的名称或者窗口的目标、一个特性的字符串。
新建页面并打开百度
新建页面并命名窗口并打开百度
在本页窗口打开,_blank是新建
注:不命名会每次打开新窗口,命名的第一次打开新窗口,之后在这个窗口中加载。
不支持
用法:可以关闭自己或者自己创建的子窗口。
第三个参数:
open(‘http://www.baidu.com’, ’baidu’, ’width=400, height=400, top=200, left=200’);
第三个参数逗号分隔,不写单位。
本身返回子窗口的window对象
可以指定弹出的窗口执行alert();
窗口的移动
<input type="button" value="打开窗口" onclick="openWin()"/>
<input type="button" value="移动窗口" onclick="moveWin()"/> var myWindow;
function openWin(){
myWindow=window.open('','','width=200,height=100');
myWindow.document.write("<p>这是我的窗口</p>");
}
function moveWin(){
myWindow.moveBy(50,100);
myWindow.focus();
}
把窗口的左上角移动到一个指定的坐标。
可相对窗口的当前坐标把它移动指定的像素。
X 要把窗口右移的像素数;
Y 要把窗口下移的像素数。
Location对象
是BOM对象之一,它提供了与当前窗口中加载的文档有关的信息,还提供了一些导航功能。事实上,location对象是window对象的属性,也是document对象的属性;所以window.location和document.location等效。
获取当前URL
对象的属性和方法:
设置?后面的字符串,并跳转
设置跳转的URL,并跳转
最有效的重新加载,有可能缓存加载
强制加载,从服务器源头重新加载
注意:reload()函数不能直接执行,必须要放到事件函数内执行。
history对象
对象是window对象的属性,它保存着用户上网的记录,从窗口被打开的那一刻算起。
属性:
对象中的记录数。
方法:
前往浏览器历史条目前一个URL,类似后退;
前往浏览器历史条目下一个URL,类似前进;
浏览器在history对象中向前或向后。
对象最初设计来表示窗口的浏览历史。但是出于隐私方面的原因,开发人员无法访问用户浏览过的URL。
navigator对象
appCodeName 返回浏览器的代码名;
appName 返回浏览器的名称;
appVersion 返回浏览器的平台和版本信息;
browserLanguage 返回当前浏览器的语言;
返回指明浏览器中是否启用cookie的布尔值;
platform 返回运行浏览器的操作系统平台;
返回OS使用的默认语言;
返回由客户机发送服务器的user-agent头部的值;
返回OS的自然语言设置。
window对象常见事件
事件
window.onload = function(){
}
事件
document.documentElement.scrollTop 代表垂直的滚动条,向下滚动的距离
document.body.scrollTop //chrome 代表垂直的滚动条,向下滚动的距离
document.documentElement.scrollLeft
document.body.scrollLeft //chrome