JavaScript浏览器对象模型B

《JavaScript浏览器对象模型B》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、第6章浏览器对象模型（BOM）本章将介绍浏览器对象模型（BOM），它是JavaScript编程技术的重要组成部分。BOM提供了独立于页面内容而与浏览器窗口进行交互的对象。浏览器对象6.1JavaScript浏览器编程示例6.26.1浏览器对象BOM由一系列相关的对象构成，图6-1所示为BOM的基本体系结构。Window对象是整个BOM的核心，所有对象和集合都以某种方式与window对象关联。图6-1BOM对象关系图BOM中定义了6种重要的对象：（1）window对象表示浏览器中打开的窗口；（2）docume

2、nt对象表示浏览器中加载页面的文档对象；（3）location对象包含了浏览器当前的URL信息；（4）navigator对象包含了浏览器本身的信息；（5）screen对象包含了客户端屏幕及渲染能力的信息；（6）history对象包含了浏览器访问网页的历史信息。除window对象之外，其他的5个对象都是window对象的属性，它们与window对象的关系如图6-1所示。下面将从window对象开始讨论BOM。6.1.1window对象Window对象表示整个浏览器窗口，但不包括其中的页面内容。Window对象可

3、以用于移动或者调整其对应的浏览器窗口的大小，或者对它产生其他影响。在浏览器宿主环境下，window对象就是JavaScript的Global对象，因此使用window对象的属性和方法是不需要特别指明的。例如我们经常使用的alert方法，实际上完整的调用形式应该是window.alert，通常情况下我们在代码中会省略window对象的声明，直接使用其方法。window对象对应着Web浏览器的窗口，使用它可以直接对浏览器窗口进行操作。window对象提供的主要功能可以分为以下5类：（1）调整窗口的大小和位置；（2

4、）打开新窗口；（3）系统提示框；（4）状态栏控制；（5）定时操作。1．调整窗口的大小和位置（1）window.moveBy该方法将浏览器窗口移动指定的距离（相对定位）。用法：window.moveBy(dx,dy)（2）window.moveTo该方法将浏览器窗口移动到指定的位置（绝对定位）。用法：window.moveTo(x,y)（3）window.resizeBy该方法将浏览器窗口的大小改变为指定的宽度和高度（相对调整窗口大小）。用法：window.resizeBy(dw,dh)（4）window.re

5、sizeTo该方法将浏览器窗口的大小改变为指定的宽度和高度（绝对调整窗口大小）。用法：window.resizeTo(w,h)2．打开新窗口用法：window.open([url][,target][,options])options参数可能的选项包括：（1）height:窗口的高度，单位为像素；（2）width：窗口的宽度，单位为像素；（3）left：窗口的左边缘位置；（4）top：窗口的上边缘位置；（5）fullscreen：是否全屏，默认值为no；（6）location:是否显示地址栏，默认值为yes；

6、（7）menubar:是否显示菜单项，默认值为yes；（8）resizable:是否允许改变窗口大小，默认值为yes；（9）scrollbars:是否显示滚动条，默认值为yes；（10）status:是否显示状态栏，默认值为yes；（11）titlebar:是否显示标题栏，默认值为yes；（12）toolbar:是否显示工具条，默认值为yes。3．系统对话框（1）window.alert该方法将显示消息提示框。用法：window.alert([message])（2）window.confirm该方法将显示一

7、个确认提示框，其中包括“确定”和“取消”按钮。用户单击“确定”按钮时，window.confirm返回true；单击“取消”按钮时，window.confirm返回false。用法：window.confirm([message])（3）window.prompt该方法将显示一个消息提示框，其中包含一个文本输入框。用法：window.prompt([message][,default])4．状态栏控制浏览器状态的显示信息可以通过window.status属性直接进行修改。5．定时操作定时操作通常有两种使用目的

8、，一种是周期性地执行脚本，例如在页面上显示时钟，需要每隔一秒钟更新一次，另一种则是将某个操作延时一段时间执行，例如某个特别耗时的操作，可以使用window.setTimeout函数使其延时执行，而后面的脚本可以继续运行不受影响。（1）window.setInterval该函数用于设置定时器，每隔一段时间执行指定的代码。用法：window.setInterval(code,interval)【例6-1