浏览器对象模型BOM

1、浏览器对象模型 BOM （ Browser Object Model ）- ZSDN时间2013-09-30 17:25:00 博客园-所有随笔区原文 /zha ngwei595806165/p/3347619.html1、结构BOM是Browser Object Model的缩写，简称浏览器对象模型BOM提供了独立于内容而与浏览器窗口进行交互的对象由于BOM主要用于管理窗口与窗口之间的通讯，因此其核心对象是windowBOM由一系列相关的对象构成，并且每个对象都提供了很多方法与属性BOM缺乏标准，JavaScript语法的标准化组织是ECMA, DO

2、M的标准化组织是W3C（WHATWG,WebHypertextApplicatio nTech nologyWorki ngGroup网页超文本应用程序技术工作组目前正在努力促进BOM的标准化）BOM最初是Netscape浏览器标准的一部分 结构图如下：2、BOM的作用BOM提供了一些访问窗口对象的一些方法，我们可以用它来移动窗口位置，改变窗口大小，打开新窗口和关闭窗口，弹出对话框，进行导航以及获取客户的一些信息如：浏览器品牌版本，屏幕分辨率。但BOM最强大的功能是它提供了一个访问HTML页面的一入口document对象，以使得我们可以通过这个入口来使用DOM的强大功能！ ！window 对象

3、是 BOM的顶层（核心）对象，所有对象都是通过它延伸出来的，也可以称为 window 的子对象。由于 window 是顶层对象，因此调用它的子对象时可以不显示的指明 window对象，例如下面两行代码是一样的：View Codewindow - window 对象是BOM中所有对象的核心。 window对象表示整个浏览器窗口，但不必表示其中包含的内容。此外，window还可用于移动或调整它表示的浏览器的大小，或者对它产生其他影响。JavaScript中的任何一个全局函数或变量都是window的属性。3、window子对象document 对象frames对象history 对象location

4、 对象navigator 对象scree n对象4、window对象关系属性pare nt :如果当前窗口为 frame，指向包含该 frame的窗口的frame (frame)self :指向当前的 window对象，与 window同意。 (window对象)top :如果当前窗口为 frame，指向包含该 frame的top-level的window 对象 window :指向当前的 window对象，与self同意。opener :当窗口是用javascript打开时，指向打开它的那人窗口(开启者)5、window对象定位属性IE提供了 window.screenLeft和window

5、.screenTop对象来判断窗口的位置，但未提供任何判 断窗口大小的方法。用document.body.offsetWidth 和 document.body. offsetHeight 属性可以获取视口的大小(显示 HTML页的区域)，但它们不是标准属性。Mozilla提供 window.screenX和 window.screenY属性判断窗口的位置。它还提供了 window.innerWidth 和 window.innerHeight 属性来判断视口的大小， window.outerWidth 和 window.outerHeight属性判断浏览器窗口自身的大小。6、window对象

6、的方法window方法及其描述方法描述alert()弹出一个带有一段消息和确认按钮的窗体blur() 把键盘焦点从顶层窗口移开clearInterval()取消由 setInterval()设置的 timeoutclearTimeout() 取消有 setTimeout()方法设置的 timeout close()关闭浏览器窗口confirm。显示带有一段消息以及确认按钮盒取消按钮的对话框 focus()把键盘焦点给予一个窗口moveBy()可相对窗口的当前坐标移动指定的像素 moveTo()把窗口的左上角移动到一个指定的坐标 ope n()打开一个新的浏览器窗体prompt()显示可提示用户

7、输入的对话框 resizeBy()按照指定的像素调整窗口的大小 resizeTo()把窗体的大小调整到指定的宽度和高度 scrollBy()按照指定的像素值来滚动内容 scrollTo()把内容滚动到指定的坐标set In terval()按照指定的周期(毫秒)来调用函数或计算表达式setTimeout()在指定的毫秒数后调用函数或表达式View Code窗体控制moveBy(x,y)从当前位置水平移动窗体x个像素，垂直移动窗体y个像素，x为负数，将向左移动窗体，y为负数，将向上移动窗体moveTo(x,y)移动窗体左上角到相对于屏幕左上角的(x,y)点，当使用负数做为参数时会吧窗体移出屏幕的

8、可视区域resizeBy(w,h)相对窗体当前的大小，宽度调整w个像素，高度调整 h个像素。如果参数为负值，将缩小窗体，反之扩大窗体resizeTo(w,h)把窗体宽度调整为 w个像素，高度调整为h个像素窗体滚动轴控制scrollTo(x,y)在窗体中如果有滚动条，将横向滚动条移动到相对于窗体宽度为x个像素的位置，将纵向滚动条移动到相对于窗体高度为y个像素的位置scrollBy(x,y)如果有滚动条，将横向滚动条移动到相对于当前横向滚动条的x个像素的位置(就是向左移动x像素)，将纵向滚动条移动到相对于当前纵向滚动条高度为y个像素的位置(就是向下移动y像素)窗体滚动轴控制scrollTo(x,y

9、)在窗体中如果有滚动条，将横向滚动条移动到相对于窗体宽度为x个像素的位置，将纵向滚动条移动到相对于窗体高度为y个像素的位置scrollBy(x,y)如果有滚动条，将横向滚动条移动到相对于当前横向滚动条的x个像素的位置(就是向左移动x像素)，将纵向滚动条移动到相对于当前纵向滚动条高度为y个像素的位置(就是向下移动y像素)窗体焦点控制focus()使窗体或控件获取焦点blur()与focus函数相反，使窗体或控件失去焦点新建窗体open()打开(弹出)一个新的窗体close()关闭窗体opener属性一一新建窗体中对父窗体的引用，中文开启者”的意思window.open方法语法win dow.op

10、e n( url, n ame, features, replace);open方法参数说明url -要载入窗体的 URLname -新建窗体的名称(目标,将在a标签的target属性中用到，当与已有窗体名称相同时 将覆盖窗体内容).open函数默认的打开窗体的方式为target的_blank弹出方式，因此页面都 将以弹出的方式打开features -代表窗体特性的字符串，字符串中每个特性使用逗号分隔replace - 一个布尔值，说明新载入的页面是否替换当前载入的页面，此参数通常不用指定 open函数features参数说明，如果不使用第三个参数，将打开一个新的普通窗口参数名称类型说明hei

11、ghtNumber设置窗体的高度，不能小于100leftNumber说明创建窗体的左坐标，不能为负值locati onBoolea n窗体是否显示地址栏，默认值为noresizableBoolea n窗体是否允许通过拖动边线调整大小，默认值为noscrollbarsBoolea n窗体中内部超出窗口可视范围时是否允许拖动，默认值为notoolbarBoolea nsetTimeout()暂停指定的毫秒数后执行指定的代码topNumber说明创建窗体的上坐标，不能为负值statusBoolea n窗体是否显示状态栏，默认值为nowidthNumber创建窗体的宽度，不能小于100特性字符串中的每

12、个特性使用逗号分隔，每个特性之间不允许有空格open方法返回值为一个新窗体的window对象的引用对话框alert（str）弹出消息对话框（对话框中有一个确定按钮）confirm（str）弹出消息对话框（对话框中包含一个确定按钮与取消按钮）prompt（str,defaultValue）弹出消息对话框（对话框中包含一个确定按钮、取消按钮与一个文本输入框），由于各个浏览器实现的不同，若没有第二个参数（文本框中的默认值）时也最好提供一个空字符串状态栏window.defaultStatus属性改变浏览器状态栏的默认显示（当状态栏没有其它显示时），浏览器底部的区域称为状态栏，用于向用户显示信息win

13、dow.status属性临时改变浏览器状态栏的显示 时间等待与间隔函数clearTimeout()取消指定的setTimeout函数将要执行的代码set In terval()间隔指定的毫秒数不停地执行指定的代码clearlnterval()取消指定的setlnterval函数将要执行的代码setTimeout与setlnterval方法有两个参数，第一个参数可以为字符串形式的代码，也可以是 函数引用，第二个参数为间隔毫秒数，它们的返回是一个可用于对应clear方法的数字ID var tid = setTimeout(alert(1),1000);alert(tid);clearTimeout

14、(tid);7、History对象，在浏览器历史记录中导航History对象的属性:length返回浏览器历史列表中的URL数量History对象的方法back()加载history列表中的前一个URLforward。加载history列表中的下一个URLgo(num)加载history列表中的某个具体页面& Location 对象Location对象的属性hash设置或返回从井号(#)开始的URL (锚)host设置或返回主机名和当前URL的端口号host name设置或返回当前 URL的主机名href设置或返回完整的URLpath name设置或返回当前 URL的路径部分port设置或返回

15、当前URL的端口号protocol设置或返回当前URL的协议search设置或返回从问号 开始的URL (查询部分)Location对象的方法assign()加载新的文档，这与直接将一个 URL赋值给Location对象的href属性效果是一样的 reload()重新加载当前文档，如果该方法没有规定参数，或者参数是false，它就会用 HTTP头If-Modified-Since来检测服务器上的文档是否已改变。如果文档已改变，reload()会再次下载该文档。如果文档未改变，则该方法将从缓存中装载文档。这与用户单击浏览器的刷新按钮的效果是完全一样的。如果把该方法的参数设置为true，那么无论文

16、档的最后修改日期是什么，它都会绕过缓存，从服务器上重新下载该文档。这与用户在单击浏览器的刷新按 钮时按住Shift健的效果是完全一样。replace。用新的文档替换当前文档，replace。方法不会在 History对象中生成一个新的纪录。当使用该方法时，新的URL将覆盖History对象中的当前纪录。9、Navigator 对象Navigator对象的属性appCodeName返回浏览器的代码名appName返回浏览器的名称 appVersion返回浏览器的平台和版本信息browserLanguage返回当前浏览器的语言cookieEnabled返回指明浏览器中是否启用cookie的布尔值c

17、puClass返回浏览器系统的CPU等级onLine返回指明系统是否处于脱机模式的布尔值 platform返回运行浏览器的操作系统平台systemLanguage返回OS使用的默认语言 userAge nt返回由客户机发送服务器的user-age nt头部的值userLanguage返回 OS的自然语言设置10、screen 对象javascript可以获取某些关于用户屏幕的信息属性 描述availHeight 返回显示屏幕的高度（除 window任务栏） availWidth 返回显示屏幕的宽度（除 window任务栏）deviceXDPI返回显示屏幕的每英寸水平点数deviceXDPI返回

18、显示屏幕的每英寸垂直点数fon tSmoothi ngE nabled 返回用户是否在显示控制面板中开启了字体平滑 height返回显示屏幕的高度logicalXDPI返回显示屏幕每英寸的水平方向的常规点数logicalYDPI返回显示屏幕每英寸的垂直方向的常规点数 pixelDepth 返回显示屏幕的颜色分辨率（比特每像素）updateI nterval设置或返回屏幕的刷新率width返回显示器屏幕的宽度每个window对象的screen属性都引用screen对象。该对象存放着有关显示器屏幕相关的 信息，我们可以根据这些信息来优化页面的输入等等。11、框架与多窗口通信子窗口与父窗口只有自身和使用 window.open方法打开的窗口和才能被JavaScript