TP2V1.0DOM编程－window对象 javascript 培训资料.ppt

第二章 DOM编程－window对象 回顾 请简述一下脚本执行的原理。 在JavaScript中有哪些控制语句及其含义？ 如何创建一个有参函数以及如何调用它？ 本章目标 会运用DOM模型查找某个HTML元素 会使用window对象的open( )方法制作各种样式的广告窗口 会使用window对象的setTimeout( )方法和Date对象制作日期显示效果 本章任务 演示示例1：广告窗口特效 演示示例2：时钟显示特效 制作广告窗口特效 制作时钟显示特效 HTML文档的树状结构 根节点 根节点 的子节点 有什么办法对HTML中的内容进行动态改变呢？ 演示示例3：动态改变HTML中的内容 使用Document Object Model 相邻节点 DOM对象模型-2 浏览器对象的分层结构 Window对象常用的属性 名称 说明 status 指定浏览器状态栏中显示的临时消息 screen 有关客户端的屏幕和显示性能的信息。 history 有关客户访问过的URL的信息。 location 有关当前 URL 的信息。 document 表示浏览器窗口中的HTML文档 常用的属性 常用的方法 onLoad事件：在窗口或框架完成文档加载时触发 window对象常用的方法和事件 名称 说明 alert (提示信息) 显示一个带有提示信息和确定按钮的对话框 confirm(提示信息“) 显示一个带有提示信息、确定和取消按钮的对话框 open (url,name) 打开具有指定名称的新窗口，并加载给定 URL 所指定的文档；如果没有提供 URL，则打开一个空白文档 close ( ) 关闭当前窗口 showModalDialog( ) 在一个模式窗口中显示指定的HTML文档 setTimeout(函数,毫秒数) 设置定时器：经过指定毫秒值后执行某个函数 如何使用window对象-1 SCRIPT language=javascript function openwindow( ) { window.status=系统当前状态：您正在注册用户......; if (window.screen.width == 1024 window.screen.height == 768) window.open(register.html); else window.alert(请设置分辨率为1024x768，然后再打开); } function closewindow( ) { if(window.confirm(您确认要退出系统吗？)) window.close( ); } /SCRIPT INPUT type=button name=regButton value= 用户注册 onclick=openwindow( ) INPUT type=button name=exitButton value= 退 出 onclick=closewindow( ) 示例完整代码 在窗口状态栏中设置文本 设置窗口的高度 使用open方法打开新窗口 弹出警告对话框 弹出确认对话框 关闭当前窗口 添加单击事件 因为window是最顶层的根，所以可以省略 window.open(google.htm); 可简写为： open(google.htm); close( )方法也是如此。 如何使用window对象-2-1 open（”打开窗口的url”，”窗口名”，”窗口特征”） 窗口的特征如下，可以任意组合： height： 窗口高度； width： 窗口宽度； top： 窗口距离屏幕上方的象素值； left：窗口距离屏幕左侧的象素值； toolbar： 是否显示工具栏，yes为显示； menubar，scrollbars 表示菜单栏和滚动栏。 resizable： 是否允许改变窗口大小，yes或1为允许 location： 是否显示地址栏，yes或1为允许 status：是否显示状态栏内的信息，yes或1为允许； 我们需要预先制作好注册页面，假设为register.html，打开注册窗口的语句如下 open(register.html, 注册窗口, toolbars=0, location=0, statusbars=0,menubars=0,width=700,height=550,scrollbars=1); 通过open方法打开注册页面之后的效果 如何使用window对象-2-2 SCRIPT language=javascript fu