山东大学：《Web技术导论》第5章 客户端开发 5.7 浏览器内部对象 5.8 Web交互 5.9 综合举例

第5章客户端开发 郝兴伟 山东大学计算机科学与技术学院 hxwasdu.edu. cn 山东大学计算机科学与技术学院 School of Computer Science& Techno logy, Shandong University

郝兴伟 山东大学计算机科学与技术学院 hxw@sdu.edu.cn 第5章 客户端开发

目录 5.7浏览器内部对象 58Web交互 59综合举例

目 录 5.7 浏览器内部对象 5.8 Web交互 5.9 综合举例

57浏览器内部对象 JavaScript为我们提供了一些非常有用的常用内部对象和方法。 用户不需要用脚本来实现这些功能。 这正是基于对象( object based)编程的真正目的。 面向对象( object oriented)OOP

5.7 浏览器内部对象 JavaScript为我们提供了一些非常有用的常用内部对象和方法。 用户不需要用脚本来实现这些功能。 这正是基于对象（object based)编程的真正目的。 面向对象（object oriented）OOP

57. navigator对象树 在 JavaScript中,有关浏览器的一些功能和信息是被封闭在 系列的对象之中,这些对象被组织成树状结构,称为 Navigator对象树 navigator wndows frame history document location anchor area image llink text password textarea radio checkbox button select hidden submit/reset 图5-7 navigator层次树

5.7.1 navigator对象树 在JavaScript中，有关浏览器的一些功能和信息是被封闭在一 系列的对象之中，这些对象被组织成树状结构，称为 Navigator对象树

572 navigator对象 在 Navigator的对象树中, navigator,对象处于最顶层,它和 window对象均在对象树顶层。主要的属性和方法有: appName属性 存储表示浏览器名称的字符串。“ Netscape”,或者 Microsoft Internet Explorer 2. app version属性 存储客户所用浏览器的版本号,一般形式为 VersionNumber+(PlatformName; Version Versionnumber为浏览器的版本号;正在运行的操作系统平台 等

5.7.2 navigator对象 在Navigator的对象树中，navigator对象处于最顶层，它和 window对象均在对象树顶层。主要的属性和方法有： 1. appName属性 存储表示浏览器名称的字符串。 “Netscape”，或者 “Microsoft Internet Explorer” 2. appVersion属性 存储客户所用浏览器的版本号，一般形式为 VersionNumber+(PlatformName;+Version;+…) VersionNumber为浏览器的版本号；正在运行的操作系统 平台 等

例5-6使用 navigator对象查看客户端浏览器特性 head> body 您的浏览器特性 document. write(navigator. app+) /script>

[例5-6] 使用navigator对象查看客户端浏览器特性 function TrueFalse (flag) { return(flag? "是":"否"); } 您的浏览器特性 浏览器名称： document.write(navigator.appName+"");

(代码续) 浏览器版本: ) script> 支持 Javascript: script language=JavaScript document. write(True False( navigator. javaEnabledO)+) script> </html

（代码续） 浏览器版本： document.write(navigator.appVersion+""); 支持javascript： document.write(TrueFalse(navigator.javaEnabled())+"");

(运行结果) 结果画e Documents and5 Settings\Administrator桌面 htm-Microsoft回x 文件()编辑()查看(收藏(A)工具(T帮助出 和后退中③团备⑨搜索收藏夹會媒体③·当” 地址)12] C:(Documents and Settings\AdministratoriI5 ay:m转到链接 My Search Edit Google More 上网助手·暂停拦截清理修复 您的浏览器特性 浏览器名称: Microsoft Internet Explorer 浏览器版本:4.0( compat ib1e:MSIE6.0: Windows nt5.0:A1exa Toolbar 支持 Javascript:是 完毕 回我的电脑

（运行结果） 结果

573 window对象 window即客户的浏览器窗口, window对象用于描述窗口 的特征,它是 document、 location和 history对象的父对象 window对象是任何对象、属性和方法的假定父对象。也 就是说,用户可以在任一对象、属性和方法(不包括 window 对象本身)之前加上一个“ window”,作为它的所有者 如果不加的话,浏览器仍假定其所有者是 window 例如 语句 alert(" hello world") 等价于: window alert("helo, world)

5.7.3 window对象 window即客户的浏览器窗口，window对象用于描述窗口 的特征，它是document、location和history对象的父对象。 window对象是任何对象、属性和方法的假定父对象。也 就是说，用户可以在任一对象、属性和方法（不包括window 对象本身）之前加上一个“window.”，作为它的所有者。 如果不加的话，浏览器仍假定其所有者是window。 例如: 语句alert("hello,world"); 等价于：window.alert("hello,world);

1 Window对象类实例: window,self, parent和top 严格地说 window,self, parent和top不能算是 window对象的 属性,更合理的说法是它们是当前环境所涉及的 window对象 实例,或称它们是特殊的关键字 sel和 window所代表的都是当前的窗口。 使用sel和 window属性的好处是增加程序可读性,因此 在比较复杂的程序中可以考虑使用它 parent所指的是当前框架或窗口所在的父窗口,这一属性在 使用框架的网页中用途最广泛 ,top是用以实现所有下级窗口的窗口,即主窗口,它和 ent有一些相似之处

1 Window对象类实例:window，self，parent和top 严格地说window，self，parent和top不能算是window对象的 属性，更合理的说法是它们是当前环境所涉及的window对象 实例，或称它们是特殊的关键字。 --self和window所代表的都是当前的窗口。 使用self和window属性的好处是增加程序可读性，因此 在比较复杂的程序中可以考虑使用它。 -- parent所指的是当前框架或窗口所在的父窗口，这一属性在 使用框架的网页中用途最广泛。 -- top是用以实现所有下级窗口的窗口，即主窗口，它和 parent有一些相似之处