第五章动态网页的制作.ppt.ppt

第五章 动态网页的制作 认识动态网页 理解动态网页 应用动态HTML ASP脚本的应用 5.1 认识动态网页 一、动态HTML与HTML 动态HTML(DHTML)指的是一种制作网页的方式。它是在HTML基础上发展起来的，但又有区别。这种方式即使在脱离网络环境的情况下,网页下载到浏览器以后仍能够随时变换的HTML。 案例:古玩今玩九连环 常见的动态HTML效果 强调： 二、动态网页与静态网页 动态网页不仅局限于动态HTML效果、还包括提供个性化信息服务的页面(有后台数据库、并提供交互)。如：搜索引擎(淘宝) 等。 静态网页是指没有后台数据库、不含程序和不可交互的HTML格式的网页。 动态网页常采用的技术 三、静态网页和动态网页的比较 静态网页的优缺点： 静态网页无需系统实时生成。 采用静态页面建立起来的站点，只能简单地根据用户的请求传送现有页面，无法实现各种个性化的交互功能。 日常维护十分繁琐。 三、静态网页和动态网页的比较 动态网页的优缺点： 动态网页可以通过更新页面的外观和行为，实现动态的交互作用。 能方便地同访问者进行交流，及时获得信息反馈。 一般由计算机实时生成，日常维护简单、更改结构方便、交互性能强大。 练一练： 练一练： 动态HTML效果的实现方式一 “DHML效果”工具栏 动态HTML效果的实现方式二 客户端脚本语言 可以直接对客户端进行编写并使页面发生动态变化的脚本语言[一种简单的描述性语言，它通过script标记嵌入到HTML页面中。] 脚本语言：JavaScript、VBScript等。 两者都是面向浏览器脚本语言 JavaScript使用方法一 JavaScript使用方法二 一次编写多次调用 JavaScript案例 日期显示 鼠标特效 更多…… 代码复用的注意点 首先确定版权问题 判断是否要修改 确定插入位置和如何插入 练一练： 练一练： 动态HTML效果的实现方式三 CSS样式表[层叠样式表] CSS样式表：用一个指定的名字来标识和保存一组有关字符和段落格式的选项集合。 (格式的组合) CSS样式表的定义 CSS样式表的应用一:内联式 内联式的作用范围就当前应用的页面。 CSS样式表的应用一:外联式 外联式就是把样式表定义成一个“.CSS”文件，然后网页中调用该文件。 CSS样式表的应用一:嵌入式 嵌入式的作用范围仅限于作用的标签。 CSS样式表的优点： 只需修改一个CSS代码文件就可以改变页数不定的网页外观和格式。 可以“随心所欲”地控制页面布局和外观。 在所有浏览器和平台之间具有较好的兼容性。 能够精简网页，提高下载速度。 代码复用的注意点 首先确定版权问题 判断是否要修改 确定插入位置和如何插入 练一练： 动态HTML的核心技术 动态HTML的设计原则 尽量精简，不要过多使用动画。 过度的闪烁让人头痛。 合理使用滚动字幕、变换选择框等。 练一练： * * 案例:古玩今玩九连环: 静态 动态 光标悬停、图片切换、文字飞入效果(DHTML工具栏实现） 在网页中加入日期，时间、鼠标特效、动感菜单（javascript、vbscript语言实现） 文字特效，网页特效。（CSS样式表） 并不是网页上所有“动”的效果都是动态HTML效果。 如：比如Flash动画、GIF图片本身就会动。 CGI、 ASP、 JSP 、 PHP、.NET等。 利用这些技术编写的页面，只有在接到用户的访问要求后，服务器才会生成并传输到用户的浏览器中。所谓的动态就是强调人机的交互，也就是按照访问者的不同需要，对访问者的信息作出不同的响应，提供相应的信息。 1、下列不是动态HTML效果的是( ) A、鼠标指向文字变为红色 B、打开某网站进自动弹出一个新窗口 C、网页中变化不断的GIF D、网页中自动更新的日期 2、网页打开时出现自动飞入的效果，应使用的触发事件是( ) A、单击B、双击C、鼠标悬停D、网页加载 3、某同学以“奥运主题班会”为关键词进行搜索时，出现的网页与几天前他用同一个搜索引擎相同关键词搜索到的网页不完全相同，这是因为该网站使用了( ) A、动态网页技术 B、静态网页技术 C、域名解析技术 D、动态分配IP地址 3、下列说法中，不是动态网页的优点的是( ) A、相对于静态网页，动态网页不太容易被搜索引擎收录 B、无须系统实时生成，网页风格灵活多样 C、日常维护方便，交互性强 D、响应速度快，减轻了服务器负担，节约了服务器存储空间 4、网页上的许多精美的动画，这些就是大家所熟悉的动态 HTML效果。( ) 5、动态网页就是指运用动态