1、任务二 网页的动态效果 一、动态一、动态HTML与与HTML 动态动态HTML(DHTML)指的是一种制作网指的是一种制作网 页的方式。它是在页的方式。它是在HTML基础上发展起来基础上发展起来 的，但又有区别。这种方式即使在脱离网的，但又有区别。这种方式即使在脱离网 络环境的情况下络环境的情况下,网页下载到浏览器以后网页下载到浏览器以后 仍能够随时变换的仍能够随时变换的HTML。 活动一：动态HTML知多少 访问你熟悉的网站，观察这些网页是否 运用了动态HTML，填写表格（注意区别动态 HTML与动画） 网页地址 是否运用了动态 HTML 运用了哪几种你知道的 动态HTML效果 常见的动态常
2、见的动态HTML效果效果 光标悬停、图片切换、文字飞入效果光标悬停、图片切换、文字飞入效果(DHTML工具工具 栏实现）栏实现） 在网页中加入日期，时间、鼠标特效、动感菜单在网页中加入日期，时间、鼠标特效、动感菜单 （javascript、vbscript语言实现）语言实现） 文字特效，网页特效。（文字特效，网页特效。（CSS样式表）样式表） 强调：强调： 并不是网页上所有并不是网页上所有“动动”的效果都是动态的效果都是动态 HTML效果。效果。 如：比如如：比如Flash动画、动画、GIF图片本身就会动。图片本身就会动。 活动二：动态HTML做一做 我制作的动态HTML效果是_， 我制作的过
3、程是_。 我观察了某同学，他制作的动态HTML效果是 _,给他的评价是 _。 二、动态网页与静态网页二、动态网页与静态网页 动态网页动态网页不仅局限于动态不仅局限于动态HTML效果、还包括效果、还包括 提供个性化信息服务的页面提供个性化信息服务的页面(有后台数据库、有后台数据库、 并提供交互并提供交互)。如：搜索引擎。如：搜索引擎(淘宝淘宝) 等。等。 静态网页静态网页是指没有后台数据库、不含程序和不是指没有后台数据库、不含程序和不 可交互的可交互的HTML格式的网页。格式的网页。 动态网页常采用的技术动态网页常采用的技术 CGI、 ASP、 JSP 、 PHP、.NET等等。 利用这些技术编
4、写的页面，只有在接到用户的利用这些技术编写的页面，只有在接到用户的 访问要求后，服务器访问要求后，服务器才会才会生成并传输到用户的生成并传输到用户的 浏览器中。所谓的动态就是强调人机的交互，浏览器中。所谓的动态就是强调人机的交互， 也就是按照访问者的不同需要，对访问者的信也就是按照访问者的不同需要，对访问者的信 息作出不同的响应，提供相应的信息。息作出不同的响应，提供相应的信息。 三、静态网页和动态网页的比较三、静态网页和动态网页的比较 静态网页的优缺点：静态网页的优缺点： 静态网页无需系统实时生成。静态网页无需系统实时生成。 采用静态页面建立起来的站点，只能简单地采用静态页面建立起来的站点，
5、只能简单地 根据用户的请求传送现有页面，无法实现各根据用户的请求传送现有页面，无法实现各 种个性化的交互功能。种个性化的交互功能。 日常维护十分繁琐。日常维护十分繁琐。 三、静态网页和动态网页的比较三、静态网页和动态网页的比较 动态网页的优缺点：动态网页的优缺点： 动态网页可以通过更新页面的外观和行为，动态网页可以通过更新页面的外观和行为， 实现动态的交互作用。实现动态的交互作用。 能方便地同访问者进行交流，及时获得信息能方便地同访问者进行交流，及时获得信息 反馈。反馈。 一般由计算机实时生成，日常维护简单、更一般由计算机实时生成，日常维护简单、更 改结构方便、交互性能强大。改结构方便、交互性
6、能强大。 自我评价表： ：表现不错；：表现一般；：还需努力 内容 评价 我能区别出网页是否是动态网页 我能独立制作动态HTML效果 老师给出的问题：我能认真观察、 思考并得出自己的结论 老师给出的任务：我能与组员积 极合作分析并互相帮助。 练一练：练一练： 一、选择：一、选择： 1、下列不是动态、下列不是动态HTML效果的是效果的是( ) A、鼠标指向文字变为红色 B、打开某网站进自动弹出一个新窗口 C、网页中变化不断的GIF D、网页中自动更新的日期 2、网页打开时出现自动飞入的效果，应使用的触发事件是、网页打开时出现自动飞入的效果，应使用的触发事件是( ) A、单击B、双击C、鼠标悬停D、
7、网页加载 3、某同学以、某同学以“奥运主题班会奥运主题班会”为关键词进行搜索时，出现的网为关键词进行搜索时，出现的网 页与几天前他用同一个搜索引擎相同关键词搜索到的网页不完页与几天前他用同一个搜索引擎相同关键词搜索到的网页不完 全相同，这是因为该网站使用了全相同，这是因为该网站使用了( ) A、动态网页技术 B、静态网页技术 C、域名解析技术 D、动态分配IP地址 练一练：练一练： 二、判断二、判断 1、网页上的许多精美的动画，这些就是大家所熟悉的动态、网页上的许多精美的动画，这些就是大家所熟悉的动态 HTML效果。效果。( ) 2、动态网页就是指运用动态、动态网页就是指运用动态HTML效果的
8、网页。效果的网页。( ) 3、在、在Frontpage中，动态中，动态HTML效果可以通过效果可以通过DHTML效果工效果工 具栏来实现。具栏来实现。( ) 4、使用动态网页技术制作的网站可以减轻网站维护的工作量、使用动态网页技术制作的网站可以减轻网站维护的工作量( ) 5、动态、动态HTML效果、效果、ASP、PHP、JSP等都是常见的动态网页等都是常见的动态网页 技术。技术。( ) 6、要给网页添加动态效果，必须借助、要给网页添加动态效果，必须借助“DHTML”效果工具栏（效果工具栏（ ） 动态动态HTML效果效果的实现方式一的实现方式一 “DHML效果效果”工具栏工具栏 动态动态HTML效果效果的实现方式二的实现方式二 客户端脚本语言客户端脚本语言 可以直接对客户端进行编写并使页面发生动态变化的可以直接对客户端进行编写并使页面发生动态变化的 脚本语言脚本语言 一种简单的描述性语言，它通过一种简单的描述性语言，它通过标标 记嵌入到记嵌入到HTMLHTML页面中。页面中。 脚本语言：脚本语言：JavaScriptJavaScript、VBScriptVBScript等。等。 两者都是面向两者都是面向浏览器浏览器脚本语言脚本语言
