JavaScript高级程序设计（六）--BOM

BOM

  BOM(Browser Object Model)即浏览器对象模型。BOM的核心对象是window，它表示浏览器的一个实例。它是JavaScript访问浏览器的接口，也是ECMAScript中规定的Global对象。

window对象

  由于window对象同时扮演者ECMAScript中Global对象的角色。所以所有全局作用域声明的变量，都会成为window的对象和方法。

var m = 0;
window.n = 0;
console.log(m,n) // 0 0

两种声明的区别在于使用var声明的变量不可以通过，delete删除，而window.nf方式声明的变量可以使用delete删除，因为使用var声明的变量的[[Configurable]]特性为false，因此不可以通过delete删除。
  直接访问未定义的变量会抛出错误，但是通过window访问是可以的。

框架

  如果页面包含框架，则每一个框架啊都用于自己的window对象，保存在frames数组中。top对象始终指向最外层的框架。parent对象当前框架的直接上层框架。没有框架的时候，top、parent、window三者相等。还有self对象始终等于window。这些四个对象都是window的属性。
  除非最高层窗口是通过，window.open()打开的。否则window的name属性不会包含任何 值。使用框架的时候，会导致浏览器中存在多个Global，会有多个原生类型的构造函数，会导致instanceof操作符出错。

窗口位置

  

var leftPos = (typeof window.screenLeft === "number") ?
				window.screenLeft : window.screenX;
var topPos = (typeof window.screenTop === "number") ? 
				window.screenTop : window.screenY;

screenX/screenY 是fireFox中的
ie返回的screenTop包含工具栏的高度。即全屏的时候不为0，其它为0；

moveTo()将窗口移动到指定位置，
moveBy()将窗口移动指定距离。
这两个方法只能对最外层window使用，不适用于框架，同时这两个方法可能会被浏览器禁用。

窗口大小

  关于浏览器大小，浏览器提供了四个属性innerWidth、innerHeight、outerWidth、outerHeight
  outerWidth和outerHeight返回浏览器窗口本身大小。innerWidth和innerHeight返回页面视图区大小。Chrome返回的两对数据相同全是视图大小。(最新版Chrome不是)。浏览器还在document.documentElement.clientHeight和document.documentElement.clientWidth保存页面视口信息，和innerWidth，innerHeight返回值相同。
resizeTo()resizeBy()可以调整浏览器窗口大小，只能对最外层window使用，同样会被浏览器禁用。

这四个函数，可以以用来操作通过window.open()打开的窗口。禁用是不能对浏览器主窗口使用。

导航和打开窗口

  window.open()可以导航到一个特定的url，也可以打开一个新的浏览器窗口，接受四个参数，要加载的URL，窗口目标，一个特性字符串以及一个表示新的页面是否取代历史记录中当前加载页面的布尔值。
  window.close()用于关闭窗口，只能关闭window.open(）打开的窗口，对于浏览器主窗口没有用户的允许是不能关闭的。
通过window.open() 打开的窗口的window对象有一个 opener属性保存这打开它的原始窗口对象。只在弹出窗口中的最外层window对象top中有定义。指向调用window.open（）的窗口或框架。
在Chrome中将opener属性置为null告诉浏览器，新创建的页面不需要和打开它的页面通信。因此可以在独立的进程中运行，标签页的关系一旦切断无法恢复。

安全限制

弹出窗口屏蔽

间歇调用和超时调用

  JavaScript是单线程语言，但它允许通过设置超时值和间歇时间来调用代码在特定的时刻执行，前者是指在指定时间过后执行代码，后者则是每隔指定时间执行一次代码。
  超时调用使用的是window对象的setTimeout()方法。接受两个参数，要执行的代码和毫秒表示的时间（即等待时间），第一个参数可以是JavaScript代码字符串（不建议使用，传递字符串性能损失）也可以是一个函数。
  第二个参数是等待的毫秒数，并不表示经过该指定时间后一定执行，仅表示经过该时间后会把该任务添加到任务队列中去。
  setTimeout()函数返回一个数值id,可以被clearTimeout用来取消超时调用。
  间歇调用则通过setInterval()实现，参数和setTimeout相同，clearInterval()用于取消间歇调用。可以使用超时调用模拟间歇调用。因为间歇调用可能会出现后一个间歇会在前一个间歇结束之前调用，模拟的间歇调用则不会有这种情况。所以最好不要使用间歇调用。

系统对话框

alert() 显示一个警告对话框
confirm() 显示一个确认框
prompt() 显示一个可以输入的提示框
window.print() 显示打印
window.find(查找内容),用于在页面中查找，找到返回true
连续弹框，浏览器允许用户阻止后面的弹框。

location对象

  location对象提供了与当前窗口中加载的文档有关的信息。还提供了一些导航功能。location既是window对象的属性，还是document对象的属性。window.location和document.location保存的是同一个对象。它还将URL解析为独立片段。

属性名	例子	说明
hash	“#contents”	返回URL中的hash，没有则返回空字符串
host	“www.wrox.com:80”	服务器名称和端口号
hostname	“www.wrox.com”	不带端口号的服务器名称
href	“http://www.wrox.com”	完整URL和toString()返回值相同
pathname	“/WileyCDA/”	URL中的目录
port	“8080”	端口，没有则返回空
protocol	“http:”	使用的协议
search	“?q=javascript”	URL查询字符串问号开头

位置操作

location.assign()方法为其传递一个URL
直接给location.href或者window.location赋值也会调用assign方法。常用的location.href赋值，修改location对象的其他属性，hash除外页面会以新的URL重新加载。
location.replace()会导航到新的URL，不会再历史记录中生成新的记录，用户不能回退到上一个页面。
location.reload()重新加载页面。传参数true会从服务器中重新加载

navigator对象

  navigator对象用于识别客户端，检测显示网页的浏览器类型。

检测插件

  非IE浏览器，可以用plugins数组每一项包含以下属性
name 插件名字
description 插件描述
filename 插件文件名
length 插件所处理的MIME类型数量
refresh()用于刷新最新的插件列表，如果穿true参数，刷新正个页面。
  IE浏览器使用ActiveXObject()

注册处理程序

  resgisterContentHandler()和resgisterProtocolHandler()这两个方法用于指明特定程序处理特定类型的信息。

screen对象

  用处不大，只是用于表达客户端的能力。

history对象

  保存着用户上网的历史记录。