1、1 1目录7.1 BOM概述 7.2 窗口对象window7.3 地址定位对象7.4 历史对象history7.5 浏览器对象navigator7.6 屏幕对象7.7 文档对象7.1 BOM概述uBOM(Browser Object Mode)是指浏览器对象模型，是用于描述浏览器对象与对象之间层次关系的模型uBOM结构：7.1 BOM概述u（1）window窗口对象 处于整个从属表的最顶级位置。每一个window对象代表一个浏览器窗口。u（2）history历史记录对象 该对象代表当前浏览器窗口的浏览历史。通过该对象可以将当前浏览器窗口中的文档前进或后退到某一个已经访问过的URL（统一资源定位
2、符）。u（3）location网址对象 该对象代表当前文档的URL。u（4）navigator浏览器对象 代表了浏览器的信息。包含的是浏览器的信息，如浏览器的名称、版本号等。u（5）screen屏幕对象 该对象代表当前显示器的信息。使用Screen对象可以获得用户显示器的分辨率、可用颜色数量等信息。u（6）document文档对象 该对象代表浏览器窗口中所加载的文档，7.2 窗口对象windowuwindow对象表示浏览器打开的窗口，提供关于窗口状态的信息。uwindow对象属性：属性描述closed返回窗口是否已被关闭。defaultStatus设置或返回窗口状态栏中的默认文本。innerh
3、eight返回窗口的文档显示区的高度。innerwidth返回窗口的文档显示区的宽度。length设置或返回窗口中的框架数量。name设置或返回窗口的名称。opener返回对创建此窗口的窗口的引用。outerheight返回窗口的外部高度。outerwidth返回窗口的外部宽度。pageXOffset设置或返回当前页面相对于窗口显示区左上角的 X 位置。pageYOffset设置或返回当前页面相对于窗口显示区左上角的 Y 位置。parent返回父窗口。self返回对当前窗口的引用。等价于 Window 属性。status设置窗口状态栏的文本。top返回最顶层的先辈窗口。windowwindow
4、 属性等价于 self 属性，它包含了对窗口自身的引用。7.2 窗口对象windowuWindow对象方法方法描述alert()显示带有一段消息和一个确认按钮的警告框。blur()把键盘焦点从顶层窗口移开。clearInterval()取消由 setInterval()设置的 timeout。clearTimeout()取消由 setTimeout()方法设置的 timeout。close()关闭浏览器窗口。confirm()显示带有一段消息以及确认按钮和取消按钮的对话框。focus()把键盘焦点给予一个窗口。moveBy()可相对窗口的当前坐标把它移动指定的像素。moveTo()把窗口的左上
5、角移动到一个指定的坐标。open()打开一个新的浏览器窗口或查找一个已命名的窗口。print()打印当前窗口的内容。prompt()显示可提示用户输入的对话框。resizeBy()按照指定的像素调整窗口的大小。resizeTo()把窗口的大小调整到指定的宽度和高度。scrollBy()按照指定的像素值来滚动内容。scrollTo()把内容滚动到指定的坐标。setInterval()按照指定的周期（以毫秒计）来调用函数或计算表达式。setTimeout()在指定的毫秒数后调用函数或计算表达式。Window.confirm()方法u案例：function fun1()var flag=window
6、.confirm(单击“确定”继续。单击“取消”停止。);if(flag)window.alert(欢迎访问我们的 web 页！);else window.alert(再见啦！);Window.open（”打开窗口的打开窗口的url”，”窗口名窗口名”，”窗口属性窗口属性”）window.open()方法8窗口属性 说明 width窗口的宽度height窗口的高度left窗口距离屏幕左边的距离top窗口距离屏幕上边的距离scrollbars是否显示滚动条，yes或1为允许；以下相同resizable设定窗口大小是否固定 menubar菜单条location地址栏toolbar 浏览器工具条，包
7、括后退及前进按钮等 fullscreen是否全屏显示titlebar标题栏status是否显示状态栏内的信息window.open()方法9 实例：实例：script language=function function new_winnew_win()()window.openwindow.open(new.(new.htmhtm,my,toolbarmy,toolbar=no,left=150,top=200,=no,left=150,top=200,menubarmenubar=no,width=150,height=150);=no,width=150,height=150);body
8、()window.close()方法案例：关闭子窗口var child=window.open(information.html,_blank,top=0,left=0,toolbar=no，fullscreen=yes,titlebar=no);function closeChild()if(!child.closed)child.close();Window定时操作u网页文件：window.open(information.html,_blank,top=0,left=0,width=200,height=200,toolbar=no);uinformation.html网页文件：(增大)
9、window.setTimeout(window.close(),5000);window.setInterval(grow(),100);function grow()window.resizeBy(5,5);通知5秒钟以后，这个窗口会自动关闭！setTimeout：过多少毫秒后执行一个操作：过多少毫秒后执行一个操作setInterval：每隔多少毫秒就执行一次操作：每隔多少毫秒就执行一次操作window.close()function closeWin()myWindow.close();/关闭名为myWindow窗口var myWindow=window.open(,width=200,
10、height=100,left=200,top=200);/定义新打开窗口对象名myWindowmyWindow.document.write(This is myWindow);/向新打开窗口中写入文本案例：关闭新打开的窗口案例：关闭新打开的窗口案例：图片轮换var arrimg=new Array(0.jpg,1.jpg,2.jpg,3.jpg,4.jpg,5.jpg);var i=1;var timer=null;function chgimg()var oImg=document.getElementById(im1);oImg.src=images/+arrimgi;i+;if(i=
11、arrimg.length)i=0;timer=window.setInterval(chgimg();,2000);function stopimg()window.clearInterval(timer);function startimg()timer=window.setInterval(chgimg();,2000);7.3地址定位对象 location名称 说明host服务器的名字href当前载入的页面的完整URLhash如果URL包含“”，将返回该符号之后的内容pathnameURL中主机名后面的部分port请求端口protocolURL中使用的协议（http:/ftp:/fil
12、e:/等）search执行GET请求的URL中问号？后的部分q属性147.3地址定位对象 location名称 说明 reload（）用于重新载入（刷新）当前网页assign(url)加载URL指定的新的 HTML 文档。replace(url)加载URL指定的文档替换当前文档q方法方法 7.3地址定位对象 location自动打开网页范例：var counter=5;function countdown()var fobj=document.getElementById(num);counter-;fobj.innerHTML=counter;if(counter=0)window.loca
13、tion.href=http:/;五秒钟后自动带你前往百度首页http:/ 5 7.4 history对象名称 说明back()相当于后退按钮forward()相当于前进按钮go(int i)go(1)代表前进1页，等价于forward()方法go(-1)代表后退1页，等价于back()方法；q方法7.4 history对象win1win2win3win4win5win6history.back()history.forward()history.go()7.4 history对象 案例：history方法 function goforward()history.go(1);function
14、goback()history.go(-1)7.5 浏览器对象navigatoru通常用于检测浏览器与操作系统的信息,包含了访客的浏览器名称、版本以及更多信息u u由于navigator没有统一的标准，因此各个浏览器都有自己不同的navigator版本，这里只介绍最普遍支持且最常用的。7.5 浏览器对象navigatoru常用的navigator属性 appCodeName-浏览器代码名的字符串表示 appName-官方浏览器名的字符串表示 appVersion-浏览器版本信息的字符串表示 cookieEnabled-如果启用cookie返回true，否则返回false javaEnabled
15、-如果启用java返回true，否则返回false platform-浏览器所在计算机平台的字符串表示 plugins-安装在浏览器中的插件数组 taintEnabled-如果启用了数据污点返回true，否则返回false userAgent-用户代理头的字符串表示unavigator中最重要的是userAgent属性，返回包含浏览器版本等信息的字符串，其次cookieEnabled也很重要，使用它可以判断用户浏览器是否开启cookie。7.5 浏览器对象navigatorvar x=navigatordocument.write(”CodeName=”+x.appCodeName)docum
16、ent.write(”)document.write(”MinorVersion=”+x.appMinorVersion)document.write(”)document.write(”Name=”+x.appName)document.write(”)document.write(”Version=”+x.appVersion)document.write(”)document.write(”CookieEnabled=”+x.cookieEnabled)document.write(”)document.write(”CPUClass=”+x.cpuClass)document.writ
17、e(”)document.write(”OnLine=”+x.onLine)document.write(”)document.write(”Platform=”+x.platform)例子：显示访客浏览器的所有详细信息例子：显示访客浏览器的所有详细信息7.6 屏幕对象screen function getInfo()var s=;s+=显示器屏幕的高度：+window.screen.height+;s+=显示器屏幕的宽：+window.screen.width+;s+=屏幕可用工作区高度：+window.screen.availHeight+;s+=屏幕可用工作区宽度：+window.scr
18、een.availWidth+;s+=你的屏幕设置是:+window.screen.colorDepth+位彩色+;s+=你的屏幕设置：每英寸水平点数是+window.screen.deviceXDPI+像素/英寸；每英寸垂直点数：+window.screen.deviceYDPI+像素/英寸;document.write(s);getInfo();注：注：Chrome，Firefox，opera浏览器对浏览器对window.screen.deviceXDPI和和window.screen.deviceYDPI属性不支持。属性不支持。screen对象包含有关客户机显示屏幕的信息。对象包含有关客
19、户机显示屏幕的信息。7.7 文档对象documentu文档对象（document）代表浏览器窗口中的文档，该对象是window对象的子对象。通过document对象可以访问HTML文档中包含的任何HTML标记并可以动态的改变HTML标记中的内容。例如表单、图像、表格和超链接等。udocument对象层次结构如图所示：documentcookieformanchorimageappletselectsubmitbuttonradiocheckboxtextpasswordoptionresethiddentextareadocument 对象的集合名称 说明anchors页面中所有锚的集合（）f
20、orms页面中所有表单的集合 applets页面中所有applet的集合embeds页面中所有嵌入式对象的集合（）images页面中所有图像的集合links页面中所有链接的集合（）q集合属性25document 对象的集合u访问方式 用document.links0访问链接 用document.images0或document.images“imgName”访问图像 用document.forms0或document.forms“frm”访问表单 用document.images0.src访问图像src属性7.7 文档对象document名称 说明alinkColor设置或检索文档中所有活动链
21、接的颜色 bgColor设置或检索 Document 对象的背景色 fgColor设置或检索 Document 对象的前景色 body指定文档正文的开始和结束linkColor设置或检索文档链接的颜色alinkColor设置或检索激活文档链接的颜色location包含关于当前 URL 的信息 title包含文档的标题url设置或检索当前文档的 URLreferrer后退一个位置的URLvlinkColor设置或检索用户访问过的链接的颜色 q属性277.7 文档对象documentfunction changeDoc()document.bgColor=blue;document.fgColor
22、=red;document.alinkColor=yellow;document.vlinkColor=0 x00ff00;document.linkColor=gray;这是普通的文本这是一个超链接无标题文档function change(color)document.bgColor=color;移过来我变色给你看看！变红色|变蓝色|变黄色利用document对象的bgColor属性改变背景色添加鼠标悬停事件7.7 文档对象document297.7 文档对象document名称 说明 clear()清除当前文档 close()关闭open打开的文档，关闭输出流并强制显示发送的数据open()打开已经载入的文档以便进行编写write(text)将文本写入文档writeln(text)将文本写入文档，末尾加入”n”q方法方法 30传道，授业，解惑
