浏览器对象BOM

1、目标 了解浏览器对象模型BOM 熟悉浏览器对象中的各种属性和方法1浏览器对象简介 2http:/Window 窗口对象location地址对象document文档对象FORM表单对象浏览器对象的分层结构window.document.myform.text1 浏览器对象模型3window对象 window对象表示浏览器中打开的窗口 。 如果文档包含框架（frame 或 iframe 标签），浏览器会为 HTML 文档创建一个 window 对象，并为每个框架创建一个额外的 window 对象。 在客户端 JavaScript 中，Window 对象是全局对象，所有的表达式都在当前的环境中计算。

2、也就是说，要引用当前窗口根本不需要特殊的语法，可以把那个窗口的属性作为全局变量来使用。例如，可以只写 document，而不必写 window.document。 4window对象的方法5Window 对象的常用属性名称名称 说明说明 document表示给定浏览器窗口中的 HTML 文档。 history 包含有关客户访问过的URL的信息。location包含有关当前 URL 的信息。 name设置或检索窗口或框架的名称。 status 设置或检索窗口底部的状态栏中的消息。 screen包含有关客户端的屏幕和显示性能的信息。 6更多属性参看：http:/ history 对象 方法名称 说

3、明 back()加载 History 列表中的上一个 URL。 forward()加载 History 列表中的下一个 URL。 go(url or number)加载 History 列表中的一个 URL，或要求浏览器移动指定的页面数。 7Back ( ) 方法相当于后退按钮forward ( ) 方法相当于前进按钮go (1)代表前进1页，等价于forward( )方法；go(-1) 代表后退1页，等价于back( )方法；Document 对象 3-1 名称名称 说明说明alinkColor设置或检索文档中所有活动链接的颜色 linkColor设置或检索文档链接的颜色vlinkColor

4、设置或检索用户访问过的链接的颜色 fgColor设置或检索页面的文本颜色 bgColor设置或检索页面的背景色 location包含关于当前 URL 的信息 title包含文档的标题url设置或检索当前文档的 URLlastModified上一次修改日期8q属性Document 对象 3-2 9集合说明forms 页面中所有表单的集合 images页面中所有图像的集合 links页 面 中 所 有 链 接 的 集 合 （ 由 表示） anchors页 面 中 所 有 锚 的 集 合 （ 由 表示） applets页面中所有applet的集合 Location对象 Location 对象 属性

5、名称 说明 host设置或检索位置或 URL 的主机名和端口号hostname设置或检索位置或 URL 的主机名部分href设置或检索完整的 URL 字符串pathnameURL中主机名后面的部分portURL中声明的请求的端口protocolURL中使用的协议10 Location对象 Location 对象 函数 名称说明assign(url)加载 URL 指定的新的 HTML 文档。 reload()重新加载当前页replace(url) 通过加载 URL 指定的文档来替换当前文档11navigator对象 navigator对象主要包含了浏览器用户使用的计算机系统的有关信息，这些信息只

6、能读取不能设置。12screen对象 availHeight窗口可以使用的屏幕的高度（以像素计），其中包括操作系统元素（如Windows工具栏）需要的空间。 availWidth窗口可以使用的屏幕的宽度（以像素计）。 colorDepth用户表示颜色的位数。大多数系统采用32位。 height屏幕的高度，以像素计。 width屏幕的宽度，以像素计。13框架 在frames集合中，可用数字（由0开始，从左到右，逐行的）或名字对框架进行索引。 也可以用top对象代替window对象引用这些框架（例如top.frames0）14导航和打开新窗口-115open（”打开窗口的打开窗口的url”，”窗口

7、名窗口名”，”窗口特窗口特征征”）窗口的特征如下，可以任意组合：height： 窗口高度； width： 窗口宽度； top： 窗口距离屏幕上方的象素值； left：窗口距离屏幕左侧的象素值； toolbar： 是否显示工具栏，yes为显示； menubar，scrollbars 表示菜单栏和滚动栏。 resizable： 是否允许改变窗口大小，yes或1为允许 location： 是否显示地址栏，yes或1为允许 status：是否显示状态栏内的信息，yes或1为允许；我们需要预先制作好广告页面，假设为adv.htm，打开广告窗口的语句如下 ：open(“adv.htm”, “”, “too

8、lbars=0, scrollbars=0, location=0, statusbars=0, menubars=0, resizable=0, width=650, height=150”);导航和打开新窗口-216function openwindow( ) open(adv.htm, , toolbars=0, scrollbars=0, location=0, statusbars=0, menubars=0, resizable=0, width=650, height=150); 看看和我一起打开的广告窗口 使用 Open 方法打开广告新窗口 添加页面加载事件新窗体添加内容 va

9、r newWindow = window.open(,myNewWindow,width=150,height=150); newWindow.document.open(); newWindow.document.write(“”); newWindow.document.write(“This is a new window”); newWindow.document.close();17设置窗体外观Window FeaturePossible ValuesDescriptionheight integer Height of new window in pixelsleft integer Windows left starting position in pixelsscrollbars yes, no Show scrollbars if page too large to fit in windowstatus yes, no Show status bartoolbar yes, no Show toolbartop integer Windows top starting position in pixelswidth integer Width