浏览器对象模型 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);