浏览器对象模型

浏览器对象模型

​ Browser Object Model 浏览器对象模型是浏览器为 js 提供的对象的集合，这些对象不需要显式的创建，可以被直接使用。
​ 例如常用的 window 对象表示的是浏览器的窗体，prompt() 方法和 alert() 方法都是 window 对象的方法；常用的 document 对象是加载在浏览器中的页面，write() 方法是 document 的方法。

window 对象所包含的对象属性

window 对象

​ window 对象可以认为是浏览器本身，是一个全局对象，再 js 中，全局函数和全局属性都是该全局对象的属性，声明一个全局变量或者函数时，就是为该全局变量生成了一个变量。

​ window 对象的某些属性也是对象。

对象	简介
document	浏览器中的页面
history	用户所访问过的页面的历史信息
navigator	包含的属性描述了正在使用的浏览器，可以使用这些属性进行平台专用的配置。
screen	包含客户计算机显示器显示能力的信息
location	浏览器所加载的当前页面的 url 的详细信息

history 对象

history 对象保存了用户访问过的页面信息，存储的页面信息列表被称为浏览器的历史栈。浏览器中的前进和后退就是通过访问历史栈中当前页面的后一个页面和前一个页面所实现的。

• back() 可以访问当前页面的前一个页面，将 location 修改为前一个页面的 url
• forward() 访问当前页面的后一个页面，将location 修改为后一个页面的 url
• go() 参数为一个数字，表示之于当前页面的相对位置， go(-1) 相当于 back()，go(1) 则相当于 forward()
• length 属性表示历史栈中页面的数量

location 对象

​ location 包含了当前页面的一些信息，包括当前页面的 url (href 属性)，当前页面的域名(hostname 属性)，端口号(port 属性)以及协议(protocol 属性)等信息。

​ 改变 location 的值能够改变当前页面的位置信息，或者对当前页面刷新。

刷新页面到其他页面可以有两种方式：

• 重置当前页的 href 属性为其他页面：

  location.href='/'
  

• 使用 replace() 方法替换当前页：

  location.replace('/')
  

​ 重置当前页面是将新页面添加到历史栈的顶部，而 replace 方法则是将历史栈中的该页面替换为新页面。

navigator 对象

navigator 对象包含了浏览器信息和当前操作系统的信息，可以用来判断不同的浏览器。

screen 对象

screen 对象包含计算机显示屏的信息，包含显示屏的高度和宽度等信息。

document 对象

document 对象可以认为是页面本身，所有由 html 标记所定义的各种对象的属性和方法都可以通过 document 对象访问。

• images[] 数组：是 document 对象的一个属性，其中包含了页面上的图片，页面上的每一个图片，浏览器都将为其创建一个 img 对象，这些对象就被存储到 images[] 数组中；
• links[] 数组：每个具有超链接属性 href 的标签都将被浏览器创建一个对象，这些对象被存放在 links[] 数组中；
• forms[] 数组：每个 from 标签都将被浏览器创建一个对象，这些对象被存放在 forms[] 数组中。

检测浏览器版本

• 检查某个对象的属性是否被用户所使用的浏览器实际支持；
• 若不支持 JavaScript，则可以使用 noscript；
• 使用 window.navigator 属性来检测浏览器原型；

用户所使用的浏览器实际支持；

• 若不支持 JavaScript，则可以使用 noscript；
• 使用 window.navigator 属性来检测浏览器原型；