《IWPDT3北大青鸟网页设计基础教材.ppt》由会员分享,可在线阅读,更多相关《IWPDT3北大青鸟网页设计基础教材.ppt(19页珍藏版)》请在金锄头文库上搜索。
1、Internet和网页设计基础和网页设计基础动动 态态 化化1课题目标课题目标i了解了解Intranet的定义的定义i解释发布一个解释发布一个Web页的过程页的过程i描述输入表单描述输入表单i解释动态解释动态HTML(DHTML)i解释解释DHTML对象模型对象模型2IntranetiIntranet: 在一个组织内使用基于在一个组织内使用基于Internet技术来促进交技术来促进交流及信息访问的一种网络流及信息访问的一种网络iIntranet与与Interneti三类人决定了三类人决定了Intranet的设计和使用的设计和使用用户用户是组织中使用是组织中使用Intranet获取信息的人员获取
2、信息的人员信息提供者信息提供者是提供所需信息的内部组是提供所需信息的内部组开发者开发者是开发工具、应用程序或组织内部应用程是开发工具、应用程序或组织内部应用程序网关的人序网关的人3IntranetIntranet的通用模型的通用模型开开 发发 者者WebWeb工具工具发布系统发布系统WebWeb应用程序和应用程序和WebWeb站点站点信息提供者信息提供者用户工具用户工具(浏览器)(浏览器)用用 户户机机 制制服服 务务信信 息息4发布发布WebWeb站点站点i发布到发布到 Internet 上上发布在发布在 Internet 上的上的WebWeb服务器(服务器(IIS)i发布到发布到 Intr
3、anet 上上发布在组织中的发布在组织中的WebWeb服务器(服务器(IIS)i发布到本机发布到本机本机上需安装本机上需安装 PWS(Personal Web Server)路径:路径:C:InetPubWWWROOT5发布发布WebWeb站点站点i发布操作:发布操作:在在FrontPageFrontPage中打开中打开“文件文件”菜单菜单指定发布站点的位置指定发布站点的位置例:例: http:/webserver/s159/s15901http:/webserver/s159/s15901 或:或: http:/10.10.11.222/s159/s15901http:/10.10.11.2
4、22/s159/s15901单击单击“发布发布”6FrontPageFrontPage服服务器器扩展展iFrontPageFrontPage服务器扩展服务器扩展安装在安装在WebWeb服务器上服务器上将会有完整的将会有完整的FrontPageFrontPage的全部功能的全部功能是运行在一个是运行在一个WebWeb服务器上的一组程序和脚本服务器上的一组程序和脚本iFrontPageFrontPage服务器扩展对发布的影响服务器扩展对发布的影响可支持完整的可支持完整的FrontPageFrontPage功能,例如协作撰写、命中计数功能,例如协作撰写、命中计数器、电子邮件表单处理器、电子邮件表单处
5、理将维护你的文件和超链接将维护你的文件和超链接可以在服务器上直接编辑可以在服务器上直接编辑 Web Web 站点站点可使用可使用HTTPHTTP来发布站点,而非来发布站点,而非FTPFTP7FrontPage WebFrontPage Web上的安全性上的安全性i对于对于WebWeb服务器上的每个服务器上的每个WebWeb站点,您可以设置下列站点,您可以设置下列各类权限:各类权限:浏览浏览站点的权限站点的权限赋予一个用户、用户组或指定计算赋予一个用户、用户组或指定计算机以浏览机以浏览Front Page Web 的权限的权限创作和浏览创作和浏览站点的权限站点的权限这赋予一个用户、用户组这赋予一
6、个用户、用户组或是指定计算机在或是指定计算机在Front Page资源管理器上打开资源管理器上打开FrontPage Web 以及在以及在FrontPage编辑器上创建并编辑文件的权限编辑器上创建并编辑文件的权限管理、创作并浏览管理、创作并浏览站点的权限站点的权限这赋予一个用户、这赋予一个用户、用户组或指定计算机以管理当前用户组或指定计算机以管理当前Front Page Web的权限的权限8表单表单i表单表单是一个网页上表单域的集合是一个网页上表单域的集合 i表单域表单域是网页上的一个数据项,用户通过在域中是网页上的一个数据项,用户通过在域中键入数据,或者选择该域,来向该域输入信息键入数据,或
7、者选择该域,来向该域输入信息文本框文本框列表框列表框单选按钮单选按钮复选按钮复选按钮文本域文本域命令按钮命令按钮i用户通过表单与服务器进行用户通过表单与服务器进行交互交互9表单的例子表单的例子10表单的标记表单的标记是是 否否演示例题:第三章演示例题:第三章表单使用表单使用.HTM11表单的典型应用表单的典型应用i收集名称、地址、电话号码、电子邮件地址及收集名称、地址、电话号码、电子邮件地址及其它信息来注册一个服务其它信息来注册一个服务i为购买某件商品而收集信息为购买某件商品而收集信息i统计某个统计某个Web站点的反馈站点的反馈i为为Web站点提供搜索工具站点提供搜索工具i为聊天会话提供界面为
8、聊天会话提供界面12动态动态HTMLHTML(DHTMLDHTML)iDHTML动态动态 HTML通常用于描述使文档动画化的通常用于描述使文档动画化的HTML、样式表及脚本的样式表及脚本的组合组合iDHTML的构成:的构成:以以HTML语言为基础语言为基础级联样式表(级联样式表(CSS)脚本语言(脚本语言(VBScript 、Jscript 或或 JavaScript)浏览器的对象模型浏览器的对象模型i例:例:悬停按钮、横幅广告、站点计数器、网页过滤效果等悬停按钮、横幅广告、站点计数器、网页过滤效果等13DHTMLDHTML的特点的特点i动态样式动态样式演示例演示例1i动态内容动态内容演示例演
9、示例2i绝对定位绝对定位可以指定元素的可以指定元素的X、Y坐标坐标可以实现可以实现Z坐标轴的定位坐标轴的定位i内建多媒体特效内建多媒体特效由内建的多媒体滤镜提供由内建的多媒体滤镜提供例:模糊、发光、下拉阴影、阴影、屏蔽、透明度等例:模糊、发光、下拉阴影、阴影、屏蔽、透明度等i数据绑定数据绑定14DHTMLDHTML对象模型象模型i4.04.0版本之后的版本之后的IE 和和 NetScape 都基于对象模型都基于对象模型i每个元素都被看作是一个可以独立访问并编程的对每个元素都被看作是一个可以独立访问并编程的对象象 i浏览器的对象有各自的属性、方法、事件浏览器的对象有各自的属性、方法、事件i是以是
10、以W3C公布的文件对象模型(公布的文件对象模型(Document Object Model )DOM为基础,再加上自己的扩展对象而成为基础,再加上自己的扩展对象而成15事件模式事件模式i事件模式事件模式网页可根据用户的动作或浏览器的状态给予响应i事件处理程序事件处理程序相关代码块,当相应的事件发生时被执行i事件类型事件类型浏览器状态改变例:onLoad 、onChange、onUnload、onResize、onReset鼠标事件:例:onMouseOver、 onMouseOut 、onMouseDown onMouseMove、 onClick 、onDblClick键盘事件:例:onKe
11、yDown 、 onKeyUp 、onKeyPress16事件的生命周期事件的生命周期l事件生命周期事件生命周期:l事件随触发事件的动作开始,在对应事件处理响应完事件随触发事件的动作开始,在对应事件处理响应完毕后结束毕后结束l事件过程步骤事件过程步骤:l用户操作或浏览器状态发生改变用户操作或浏览器状态发生改变l浏览器对象更新其信息,反应事件状态浏览器对象更新其信息,反应事件状态l事件被触发或响应事件事件被触发或响应事件l调用相关的事件处理程序调用相关的事件处理程序17事件冒泡事件冒泡l 事件冒泡:事件冒泡:l事件会传递给上一层对象事件会传递给上一层对象l上一层对象接收到事件,会调用并执行该对象的事件上一层对象接收到事件,会调用并执行该对象的事件处理程序处理程序l事件会继续往上传递,事件处理程序会被再次调用并事件会继续往上传递,事件处理程序会被再次调用并执行执行l直到最后到达直到最后到达WINDOW对象为止对象为止 l演示例题演示例题18本课总结本课总结iIntranet是组织内部的一个计算机网络是组织内部的一个计算机网络i如何发布如何发布WEB站点站点iFrontPage服务器扩展服务器扩展i表单是与用户交互的一种方式表单是与用户交互的一种方式i动态动态HTML是基于对象模型的是基于对象模型的i事件响应和处理程序事件响应和处理程序19