浏览器对象模型 BOM
浏览器对象模型 BOM(Browser Object Model)
由于现代浏览器已经(几乎)实现了 JavaScript 交互性方面的相同方法和属性,因此常被认为是 BOM 的方法和属性
Window 对象
Window 对象表示浏览器中打开的窗口。
如果文档包含框架(frame 或 iframe 标签),浏览器会为 HTML 文档创建一个 window 对象,并为每个框架创建一个额外的 window 对象。
所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员。
全局变量是 window 对象的属性。
全局函数是 window 对象的方法。
甚至 HTML DOM 的 document 也是 window 对象的属性之一。
Window 尺寸
浏览器的视口,不包括工具栏和滚动条。
对于Internet Explorer、Chrome、Firefox、Opera 以及 Safari:
window.innerHeight - 浏览器窗口的内部高度
window.innerWidth - 浏览器窗口的内部宽度
对于 Internet Explorer 8、7、6、5:
document.documentElement.clientHeight
document.documentElement.clientWidth
或者
document.body.clientHeight
document.body.clientWidth
实例
var w=window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;
var h=window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;
History 对象
History 对象包含用户(在浏览器窗口中)访问过的 URL。
History 对象是 window 对象的一部分,可通过 window.history 属性对其进行访问。
History 对象属性:
length 返回浏览器历史列表中的 URL 数量。
History 对象方法:
back() 加载 history 列表中的前一个 URL。
forward() 加载 history 列表中的下一个 URL。
go() 加载 history 列表中的某个具体页面。
例子:
history.back()//执行的操作与单击后退按钮执行的操作一样
history.go(-2)//执行的操作与单击两次后退按钮执行的操作一样
Location 对象
Location 对象包含有关当前 URL 的信息。
Location 对象属性:
href 设置或返回完整的 URL。
Location 对象方法:
assign() 加载新的文档。
reload() 重新加载当前文档。
replace() 用新的文档替换当前文档。
Window 对象方法
alert() 显示带有一段消息和一个确认按钮的警告框。
blur() 把键盘焦点从顶层窗口移开。
close() 关闭浏览器窗口。
focus() 把键盘焦点给予一个窗口。
moveBy() 可相对窗口的当前坐标把它移动指定的像素。
moveTo() 把窗口的左上角移动到一个指定的坐标。
示例:
window.moveTo(50,50);
open() 打开一个新的浏览器窗口或查找一个已命名的窗口。
示例:
var a=window.open('','','width=200,height=100');
prompt() 显示可提示用户输入的对话框。
resizeBy() 按照指定的像素调整窗口的大小。
resizeTo() 把窗口的大小调整到指定的宽度和高度。
scrollBy() 按照指定的像素值来滚动内容。
示例:
function fn2(){
scrollBy(0,200);//可以用它来滚动到指定内容
}
scrollTo() 把内容滚动到指定的坐标。
示例:
function fn1(){
scrollTo(0,0);//可以用它来回到顶部
}
setInterval() 按照指定的周期(以毫秒计)来调用函数或计算表达式。
示例
function show()
{
alert('a');
}
setInterval(show, 1000);
setTimeout() 在指定的毫秒数后调用函数或计算表达式。
示例
timer=setTimeout("fn3()",100);
clearInterval() 取消由 setInterval() 设置的 timeout。
clearTimeout() 取消由 setTimeout() 方法设置的 timeout。
示例
clearTimeout(timer);