WebCh06B(HaoXW)客户端编程研究.ppt

计算机网络原理、技术及应用 目 录 第 1 章 Web技术基础 第 2 章 标记语言与网页制作 第 3 章 图像处理技术 第 4 章 音频与视频处理 第 5 章 Flash动画设计 第 6 章 客户端编程 第 7 章 服务端编程 第 6 章 客户端编程 浏览器与客户端脚本程序 JavaScript程序设计基础 事件驱动及事件处理 对象及其操作 常用内部对象及函数 JavaScript浏览器对象模型BOM HTML文档对象模型DOM Web交互 使用AJAX技术 综合举例 JavaScript浏览器对象模型BOM 脚本程序设计语言 ECMAScript规范 浏览器对象模型（Browser Object Model，BOM） 文档对象模型（Document Object Model，DOM） 浏览器对象模型BOM 就是指当用户打开浏览器时，浏览器中的JavaScript runtime engine将在内存中自动创建一组对象，用于对浏览器及HTML文档对象模型中数据的访问和操作。 window对象 window对象 即客户的浏览器窗口，window对象用于描述窗口的特征，它是document、location、history等对象的父对象函数isNaN()用于判断一个字符串是否为数字（Not a Number） window对象的常用属性 window，self，parent和top opener属性 screenLeft和screenTop属性 defaultStatus和status属性 成员对象 navigator对象、 document对象、frames对象、history对象、location对象、screen对象等 window对象（Cont1.） window对象常用方法 open()方法 open(URL,WindowName,Window Features); 例如：if （userrole==）window.open( other.htm , _self ); close()方法 newWin.close()； 例如：a href=# onClick=window.opener=null;window.close();关闭窗口/a moveBy（x,y）方法 resizeBy(x,y)方法 scroll(x,y)方法 focus()和blur()方法 系统提示相关方法 alert(字符串) 方法 confirm(字符串) 方法 prompt(message,initial input); setTimeout()和clearTimeout()方法 window对象应用举例 定义四个按钮“打开新窗口”、“关闭新窗口”、“查看源码”和“测试window对象属性及方法”。 点击“打开新窗口”按钮，则打开一个新窗口， 点击“查看源码”窗口则显示当前Web页的html源代码。假设窗口的特征是没有工具栏、菜单、状态栏、定位栏，高200个像素，宽200个像素。 按钮“测试window对象属性及方法”对应一个test函数，通过修改该函数内容，可以分别测试window对象的其他属性和方法。 HTML代码testwin.htm html head script language=javascript function newone(url) { newWin=open(url,subWindow, width=200,height=200,toolbar=0,status=0,location=0,menubar=0); return newWin; } function closeone(xWin) { // 若窗口存在，并且没有被关闭 if (xWin != ! xWin.closed) xWin.close(); } // 可以修改该函数代码，测试window对象的其他方法 function test() { window.moveTo(0,0); } /script /head body input type=button value=打开新窗口 name=B1 onclick=javascript:temp=newone(bookIndex.htm) nbsp; input type=button value=关闭新窗口 name=B2 onclick=javascript:closeone(temp); br input type=button value=显示源文件 name=B3 onclick=window.location=view-source:+window.location.hrefbr