第8章BOM笔记

第八章 BOM

一. Window

在浏览器中window有双重角色，他既是JavaScript访问浏览器窗口的一个借口，又是ECMAscript 规定的Global对象。

1.全局作用域

由于window是ECMAscript 规定的Global对象的角色，因此在全局作用域中声明的变量，函数，都会是window对象的属性和方法。

2.窗口位置

a) screenLeft和screenTop

对与ie Safari Opera Chrome都提供了screenLeft,screenTop属性表示窗口相对于屏幕左边和上边的位置。Firefox则在screenX和screenY,属性和上面一样

跨浏览器的窗口位置的代码：

Var leftPos=(typeof window.screenLeft==”number”)?

window.screenLeft:screenX,

Var toppos=(typeof window.screenTop==”number”)?

window.screenTop:screenY,

b) MoveTo（）和moveBy（）

MoveTo接受的是新位置的x和y的坐标，

moveBy表示的是水平和垂直方向上移动的像素数。

3.窗口的大小

Ie9和其他浏览器中四个属性

OuterWidth和outerHeight表示的浏览器本身的尺寸，

innerWidth和innerHeight表示的是表示页面视图区域的大小（出去边框的宽度），

在ie8 以及更早的版本中，只提供了页面可见区域的相关信息，

document.documenteElement.clientWidth

document.documenteElement.clientHeight保存了页面的视口信息。在ie6中只有在标准模式下才有效，而在混杂模式下使用：

Document.body.clientWidth

Document.body.clientHeight

resizeTo()和resizeBy()方法可以调整浏览器窗口的大小；resizeTo()方法接受两个参数，表示的是新窗口的宽高。resizeBy()也是两个参数表示的是新窗口和原来窗口的高宽度只差。

4.对于移动端

可见视口：window.innerWidth和window.innerHeight保存着可见视口，也就是 屏幕上可见页面区域的大小，IE的移动浏览器不支持这些属性，但 是通过

document.documenteElement.clientWidth

document.documenteElement.clientHeight提供了相同的信息。随着页 面的缩放这些值也会变化。

布局视口：在其他移动浏览器中doxument.documenteElement保存的是布局视 口，即渲染后页面的实际大小，（可见视口是页面中的一部分）， ie把布局视口保存在

Document.body.clientWidth

Document.body.clientHeight中

5.window 方法

Window.open()方法：接收四个参数，要加载的URL，窗口目标，一个特性字符串以及一个表示新页面是否取代浏览器历史记录中当前加载页面的布尔值。

第二个参数：该参数是已有的窗口或框架的名称，那么就会在具有该名称的窗口或框架中加载第一个参数指定的URL

如果第二个参数不存在，该方法会更具第三个参数特性打开一个新的窗口或新标签页，

特性有：fullscreen  值yes或no  表示窗口是否最大化 仅限IE

Height：新窗口的高度

Width：宽度

Left：新窗口的左坐标

Right:新窗口的右坐标

。。。。。。。。

Close()方法可以关闭新打开的窗口，这个方法仅限于用window.open()打开的窗口，

6.定时器

setTimeout()：两个参数第一个是可以是字符串也可以是函数 第二参数是毫秒数  表示指定时间执行，

Setinterval();每隔多少秒执行

7.系统对话框

Alert(), confirm(),prompt()

confirm()比 alert()多了一个取消按钮

prompt()多了一个文本框共用户输入信息

二 location对象

Location不仅是window的属性还是document得属性

Location的属性：

Hash    #hhhh   返回的是URL中的hash（#号后跟0或多个字符）如果URL中不包含散列 返回空

Host       返回服务器名称和端口号

Hostname    返回不带端口的服务器名称

Href       返回当前页面的完整的ＵＲＬ

Pathname      返回URL中的目录或文件名

Port     返回URL中指定的端口号

Protocol    返回页面使用的协议

Search    “?=javascript”  返回URL的查询字符串，这个字符串以？开头

1.位置操作

1.使用assign()方法并为其传递一个URL，这样就可以立即打开一个新的URL并在浏览器历史记录中生成一个新记录

使用 window.location 和location.href和使用assign()方法一样

一般最常用的是location.href属性

以上的location的属性都可以改变当前浏览的页面，

2.reload()方法 重新加载当前显示页面，当不加任何参数时表示有可能从缓存中加载，当传递ture时表示从服务器加载。

三 navigator对象

Navigator的属性略

1. 检测插件

Plugins数组：来检测插件（对ie无效）

属性：

Name :插件的名称

Description 插件的描述

Filename 插件的扩展名

Length:插件所处理的mime类型数量

如：

Function hasPlugin(name){

Name=name.toLowerCase();

For(var i=0;i<navigator.plugins.length;i++){

If(navigator.plugins[i].name.toLowerCase().indexOf(name)>-1){

Return ture;

}

}

Return false;

}

Alert(hasPlugons(“flash”))   检查flash

检测ie略

1. 注册处理程序

registerContentHandler()和registerProtocoHandler()这两个方法可以让一个站点致命他可以处理特定类型的信息。

四 screen 对象

availHeight  屏幕的像素高度减去系统部件的高度之后的值

availWidth   屏幕的像素宽度减去系统部件的宽度之后的值

...........

五  history 对象

go()方法  可以接受一个整数值，正数表示向前跳转  负数表示向后跳转

也可以接受一个字符串，表示跳转历史记录中最近的相同的字符串的那个页面。

Back()

Forward()可以模仿浏览器的后腿和前进按钮