第8章+网页制作技术-精品文档资料整理.ppt

《第8章+网页制作技术-精品文档资料整理.ppt》由会员分享，可在线阅读，更多相关《第8章+网页制作技术-精品文档资料整理.ppt（83页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程1本章概述本章概述本章从HTML语言基本知识开始逐渐深入，概括性地讲述了有关网页制作的相关知识。努力让读者既有一个初步的也有一个整体的认识，如果读者对某部分的内容有兴趣，可以查阅该方面的详细资料，包括教学网站上的辅助资料，进行深入的学习。第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程28.1 网页设计基础知识网页设计基础知识 8.2 简单页面元素使用方法简单页面元素使用方法 8.3 高级页面元素的使用方法高级页面元素的使用方法 8.4 网

2、页制作示例网页制作示例 8.5 实用技巧快速参考实用技巧快速参考 第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程38.1 8.1 8.1 网页设计基础知识网页设计基础知识网页设计基础知识网页设计基础知识网页设计基础知识网页设计基础知识 8.1.1 HTMLHTML语言概述语言概述 8.1.2 WEBWEB服务器服务器 8.1.3 客户端脚本语言客户端脚本语言 返 回8.1.4 服务器端动态网页技术服务器端动态网页技术 8.1.5 网页制作工具网页制作工具DreamweaverDreamweaver概述概述 8.1.6 网站设计的基本原则网

3、站设计的基本原则 第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程48.1.18.1.18.1.1 HTML语言概述语言概述 1.HTML1.HTML语言的由来与特点（语言的由来与特点（1/21/2）80年代早期、IBM、通用标记语言（Generaized Markup Language），即GML、概念性。1986年、国际标准化组织（ISO）、发布了为生成标准化文档而定义的标记语言标准（ISO8879），简称为SGML，即标准通用标记语言。SGML定义了许多不同类型的文档，其中包括超文本文档。超文本标记语言HTML（Hypertext M

4、arkup Language）定义了超文本文档的SGML的子集。但是人们习惯使用术语HTML表示超文本文档本身（属于一种特殊类型的SGML文档）和用以产生超文本文档的标记语言。HTML的领头先锋是美国麻省理工学院（MIT）计算机科学实验室的WWW标准化组织W3C（World Wide Web Consortium）。返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程58.1.18.1.18.1.1 HTML语言概述语言概述 1.HTML1.HTML语言的由来与特点（语言的由来与特点（2/22/2）所谓超文本，相对于标准的文本（只有字符、

5、只表示文字）而言，它可以加入图片、声音、动画、影视等内容，还可以从一个文件跳转到另一个文件，与世界各地主机的文件链接。但这些内容的表示形式依然是使用文本字符的，因而HTML文档能独立于各种操作系统平台（如UNIX、WINDOWS等）。自1990年以来HTML就一直被用作World Wide Web的信息表示语言，用于描述Homepage的格式设计和它与WWW上其它Homepage的链接信息。使用HTML语言描述的文件，需要通过WWW浏览器显示出效果。通过以下几行对照内容可以窥出HTML语言的特点：标签、属性、值。图片调用：文字格式：文字页面跳转：A HREF=文件路径/文件名多媒体声频：多媒体

6、视频： 返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程68.1.18.1.18.1.1 HTML语言概述语言概述 2.HTML2.HTML文档的基本结构（文档的基本结构（1/21/2）HTML文档的结构就是网页的结构，即使是一个空白的网页，也必须包含下面的基本标记信息。头部信息文档主体，正文部分超文本文档分文档头和文档体两部分，在文档头里，对这个文档进行了一些必要的定义，文档体中才是要显示的各种文档信息。其中在最外层，表示这对标记间的内容是HTML文档。之间包括文档的头部信息，如文档总标题等，若不需头部信息则可省略此标记。标记一般不

7、省略，表示正文内容的开始。返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程78.1.18.1.18.1.1 HTML语言概述语言概述 2.HTML2.HTML文档的基本结构（文档的基本结构（2/22/2）下面是一个最基本的超文本文档的源代码：一个简单的HTML示例欢迎光临我的主页这是我第一次做主页，无论怎么样，我都会努力做好！ 返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程88.1.18.1.18.1.1 HTML语言概述语言概述 3.HTML3.HTML文档的标签（文档的

8、标签（1/51/5）超文本中遇到的最大障碍就是一些用“”括起来的句子，我们称它为标签，是用来分割和标记文本元素（以后也称页面元素）。单标签某些标记称为“单标签”，因为它只需单独使用就能完整地表达意思，这类标记的语法是：最常用的单标签是，它表示换行。 返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程98.1.18.1.18.1.1 HTML语言概述语言概述 3.HTML3.HTML文档的标签（文档的标签（2/52/5）双标签另一类标记称为“双标签”，它由“始标签”和“尾标签”两部分构成，必须成对使用，其中始标签告诉Web浏览器从此处开始

9、执行该标记所表示的功能，而尾标签告诉Web浏览器在这里结束该功能。尾标签是在标签前加一个斜杠（/）形成的。这类标记的语法是：内容其中“内容”部分就是要被这对标记施加作用的部分。例如你想突出对某段文字的显示，就将此段文字放在一标记中：第一：返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程108.1.18.1.18.1.1 HTML语言概述语言概述 3.HTML3.HTML文档的标签（文档的标签（3/53/5）标签属性许多单标记和双标记的始标记内可以包含一些属性，其语法是：各属性之间无先后次序，属性也可省略（即取默认值），例如单标记表示在

10、文档当前位置画一条水平线（horizontal line），一般是从窗口中当前行的最左端一直画到最右端。附带一些属性后的形式如：其中SIZE属性定义线的粗细，属性值取整数，缺省为1；ALIGN属性表示对齐方式，可取LEFT（左对齐，缺省值）、CENTER（居中）、RIGHT（右对齐）；WIDTH属性定义线的长度，可取相对值，（由一对 号括起来的百分数，表示相对于充满整个窗口的百分比），也可取绝对值（用整数表示的屏幕像素点的个数，如WIDTH=300），缺省值是100%。 返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程118.1.18

11、.1.18.1.1 HTML语言概述语言概述 3.HTML3.HTML文档的标签（文档的标签（4/54/5）语言字符集（Charsets）信息（meta标签）#位置需要填写该主页的字符集信息，众多的字符集名称有us-ascii、iso-8859-1、x-mac-roman、x-euc-jp、gb2312、x-euc-tw等，不一一列举。 返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程128.1.18.1.18.1.1 HTML语言概述语言概述 3.HTML3.HTML文档的标签（文档的标签（5/55/5）body标签背景色彩和文字色

12、彩bgcolor背景色彩text非可链接文字的色彩link可链接文字的色彩alink正被点击的可链接文字的色彩vlink已经点击（访问）过的可链接文字的色彩#=rrggbb色彩是用6位16进制构成的红绿蓝（red-green-blue，RGB）值来表示。16进制的数码有:0、1、2、3、4、5、6、7、8、9、a、b、c、d、e、f。背景图象页面空白（Margin）页面左边的空白页面上方的空白（天头）通过以上的内容读者对标签已经有了充分的认识，应该说，以后遇到任何标签即页面元素都会很容易理解，无非就是通过属性/值对来控制显示的特征而已。所以后面将几乎不再细述任何标签。 返 回第第8 8章章 网

13、页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程138.1.18.1.18.1.1 HTML语言概述语言概述 4.HTML标签主要分类不论是了解HTML、还是从可视化的页面设计角度看，都应抓住主要的HTML元素类型。这些主要类型如下：文档结构与空间控制标记。文本控制标记。表格类标记。链接类标记。图像类标记。表单类标记。框架类标记。多媒体类标记。其他扩展标记：HTML页面不是独立存在的，需要结合其他的技术，所以其他技术内容嵌入到HTML中必须借助于尚未使用的标记，如后面将要叙述的一些技术。理论上，标记种类可以是无限的。 返 回第第8 8章章 网页制作技术网页制

14、作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程148.1.28.1.28.1.2 WEB服务器服务器 1.Web服务器Web服务器是指驻留于因特网上某种类型计算机的程序。当Web浏览器（客户端）连到服务器上并请求文件时，服务器将处理该请求并将结果文件发送到该浏览器上，附带的信息会告诉浏览器如何查看该文件（即文件类型）。服务器使用HTTP（超文本传输协议）进行信息交流，因此也称为HTTP服务器。Web服务器可驻留于各种类型的计算机之上，从常见的PC到巨型的UNIX网络，以及其他各种类型的计算机。它们通常经过一条高速线路与因特网连接，如果对性能无所谓，则也可使用低速连接（甚至

15、是调制解调器）。当然，可以用自己的计算机组建Web服务器。 返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程158.1.28.1.28.1.2 WEB服务器服务器 2.网关脚本/程序Web服务器不仅能够存储信息，还能在用户通过Web浏览器提供的信息的基础上运行脚本和程序。例如，用户填写一个信息查询表单，点击提交按钮，该表单将送至服务器计算机上的某一程序，它负责处理该请求，并返回适当形式的结果，如一个网页。用于执行这些功能的程序或脚本称为网关脚本/程序，或称为CGI（通用网关界面）脚本。 返 回第第8 8章章 网页制作技术网页制作技术

16、首页首页结束结束2022年7月16日星期六大学计算机基础教程168.1.28.1.28.1.2 WEB服务器服务器 3.虚拟主机虚拟主机是使用特殊的软硬件技术，把一台计算机主机分成一台台“虚拟”的主机，每一台虚拟主机都具有独立的域名和IP地址（或共享的IP地址），具有完整的因特网服务器功能。虚拟主机之间完全独立，在外界看来，每一台虚拟主机和一台独立的主机完全一样，用户可以利用它来建立完全属于自己的WWW、FTP和E-mail服务器。虚拟主机技术的出现，是对因特网技术的重大贡献。由于多台虚拟主机共享一台真实主机的资源，每个用户承受的硬件费用、网络维护费用、通讯线路费用均大幅度降低，使因特网真正成

17、为人人用得起的网络。现在，几乎所有的美国公司（包括一些家庭）均在网络上设立了自己的Web服务器。虚拟主机服务提供者的服务器硬件构成的性能比较高，通讯线路也比较通畅，可以达到非常高的数据传输速度（可达45Mb/s），为用户提供了一个良好的外部环境；用户还不用负责机器硬件的维护、软件设置、网络监控、文件备份等工作。 返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程178.1.28.1.28.1.2 WEB服务器服务器 4.服务器托管服务器托管即租用ISP机架位置，建立企业Web服务系统。企业主机放置在ISP机房内，由ISP分配IP地址，提

18、供必要的维护工作，由企业自己进行主机内部的系统维护及数据的更新。这种方式特别适用于有大量数据需要通过因特网进行传递，以及有大量信息需要发布的单位。 返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程188.1.38.1.38.1.3 客户端脚本语言客户端脚本语言 1.动态HTML（DHTML、Dynamic HTML）（1/4）DHTMLDynamic HTML是一种制作网页的方式，既不是一种网络技术，也不是一个标记或插件。它可以通过JavaScript、VBScript、Document Object Modle（DOM）、layer

19、s或者CSS来实现。DHTML能改变页面中的一些效果，但不保证在不同的浏览器上有相同的效果。典型的DHTML例子就是当鼠标移到一幅图片的上面时，该图片变为另一幅图片。至于怎样让浏览器实现了这样的变化，就是DHTML中所包含的技术。客户端的脚本语言经常见到的客户端脚本语言（如JavaScript和VBScript）就是DMTML的内容之一。在Microsoft和Netscape发布的4.0级的浏览器里，允许使用脚本语言去改变HTML语言中大多数的元素。能够被脚本语言改变的页面元素是符合文档对象模型（Document Object Model）的。 返 回第第8 8章章 网页制作技术网页制作技术

20、首页首页结束结束2022年7月16日星期六大学计算机基础教程198.1.38.1.38.1.3 客户端脚本语言客户端脚本语言 1.动态HTML（DHTML、Dynamic HTML）（2/4）文档对象模型DOM是dynamic HTML中的核心内容或基础，是它使得HTML代码能够被改变。实际上就是将HTML文档及其中的HTML元素等对象化，并开放给脚本语言，浏览器就可以执行语言脚本来改变这些元素了（IE4开始）。当然不是所有元素都能被改变的。事件模型在DOM中有一部分内容，专门用来指定什么元素能够改变，这就是事件模型。所谓事件就是对作用于计算机的用户行为和系统行为的一个抽象，抽象的逻辑结果就是

21、计算机的动作都是由事件触发的。例如，因为鼠标双击了一个文件图标，系统才打开了这个文件。即使是在网页中，也抽象了几乎所有的事件。如：把鼠标放在一个页面元素上（onmouseover），加载一个页面（onload），提交一个表单（onsubmit），在表单的文字输入部分用鼠标点击一下（onfocus）等等。表8-1列出了一些主要的事件。 返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程208.1.38.1.38.1.3 客户端脚本语言客户端脚本语言 1.动态HTML（DHTML、Dynamic HTML）（3/4）返 回网页主要事件一览表

22、事件发生的时机典型对象onAbort访问者中断浏览器正在载入图像的操作标签定义的image对象onBlur失去键盘输入焦点文本框等onChange输入值发生变化文本框等onClick鼠标单击按钮、链接onError网页或图像载入产生错误Image、window对象onFocus获得键盘输入焦点文本框等onKeyDown键盘按下文本框等onKeyUp键盘松开文本框等onKeyPress键盘一次有效按键文本框等onLoad一图像或网页载入完成时Image、window对象onMouseDown按下鼠标onMouseUp松开鼠标onMouseMove鼠标在指定元素上移动时onMouseOut鼠标从指

23、定元素上移开onMouseOver鼠标进入指定元素时Area、Link对象onMove窗体或框架移动时window or frameonReset表单内容重置时onResize改变浏览器或框架大小window or frameonSelect选择文本框中的文本时文本框等onSubmit按下Submit按钮onUnload网页卸载Window对象第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程218.1.38.1.38.1.3 客户端脚本语言客户端脚本语言 1.动态HTML（DHTML、Dynamic HTML）（4/4）级联样式表CSS因为

24、CSS是DOM中的一部分，其实就是DOM使用CSS表示对象的属性，因而也是DHTML的主要方式，所以让脚本语言能够改变CSS中的一些属性。通过改变CSS，就能够改变页面中的许多显示效果。这些效果包括颜色、位置以及大小等。基于以上的说法可以看出，动态HTML主要的表现形式就是使用脚本语言来改变页面元素，其基础是改变DOM对象的属性值，包括HTML语言中规定的页面元素的属性和DOM规定的CSS属性。CSS的内容后面叙述，本小节概括介绍一下脚本语言中的一种JavaScript，它的语法与Java语言相似，也仅仅是相似，其实差别也不小，另外JavaScript和Java语言根本就没有关系。 返 回第第

25、8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程228.1.38.1.38.1.3 客户端脚本语言客户端脚本语言 2.JavaScript语言概述（1/5）使用客户端脚本语言，原则上是需要了解一些程序设计知识的。对于本书的读者，一般是没有程序设计基础和爱好的，虽然如此，由于脚本语言和标准的程序设计语言不同，编写的代码都是片断（脚本）、语法灵活、很多情况下不需要有什么完整的程序设计思想，所以入门还是容易的。这也是像VB这样的软件开发工具那么容易入门、现在容易改行并能够号称程序员的人如此之多的原因之一吧！JavaScript的主要作用应用于B/S结

26、构的应用程序，由浏览器负责解释执行。替代服务器解决一些可以在客户端完成的工作，如数据验证工作。浏览器端网页及浏览器的动态控制。只限于在浏览器范围内（理论上不能打开、读写和保存用户计算机上的文件）。 返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程238.1.38.1.38.1.3 客户端脚本语言客户端脚本语言 2.JavaScript语言概述（2/5）JavaScript示例以下给出几个JavaScript应用示例，并给出有关的事件、对象、代码等内容。显示一个消息框本例在网页加载之后显示一个消息框，提示操作者“此账号已经被人注册，请选

27、择其它账号！”。网页加载事件：onload；适用的页面元素：body；消息框函数：alert()；JavaScript脚本：alert(此账号已经被人注册，请选择其它账号！)；HTML代码形式： 返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程248.1.38.1.38.1.3 客户端脚本语言客户端脚本语言 2.JavaScript语言概述（3/5）JavaScript示例改变图片本例在鼠标点击一个图片的时候改变图片。鼠标点击事件：onclick；采用的页面元素：img；操作属性：图像对象imga的src属性；JavaScript脚本

28、：imga.src=image/o1.gif；HTML代码形式： 返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程258.1.38.1.38.1.3 客户端脚本语言客户端脚本语言 2.JavaScript语言概述（4/5）操作提问本例在点击删除按钮时候给出提问。鼠标点击事件：onclick；页面元素：input（表单域）元素类型：按钮button；按钮所在表单：formCourse；对话框函数：confirm()；提交函数：submit()；JavaScript脚本：i f ( w i n d o w . c o n f i r m

29、( 删 除 此 条 记 录 吗 ？ ) ) document.formCourse.submit()；HTML代码形式： 返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程268.1.38.1.38.1.3 客户端脚本语言客户端脚本语言 2.JavaScript语言概述（5/5）禁止鼠标右键的操作本例针对一个单元格，禁止鼠标右键的所有操作。鼠标右键快捷菜单事件：oncontextmenu；采用的页面元素：td（单元格）交互函数：return()；JavaScript脚本：return(false)；HTML代码形式： 主页通过以上几个示

30、例的研究，读者应该基本上了解了简单有效的JavaScript形式。当然，这只是JavaScript语言冰山的一角。对JavaScript略感兴趣的读者，可以阅读一下本小节后面的内容。这里简述一下JavaScript语言的各种元素，还要深入研究的读者请查找有关资料。 返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程278.1.38.1.38.1.3 客户端脚本语言客户端脚本语言 3.JavaScript的数据类型（4种基本数据类型和对象类型）：数值布尔型（true、false）字符串（单、双引号都行，支持/转义）空值（null），应说是

31、无类型对象javascript变量的数据类型属于弱类型，可以不声明，变量类型随时随地受赋值影响。 返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程288.1.38.1.38.1.3 客户端脚本语言客户端脚本语言 4.JavaScript的变量、运算符、控制语句变量可以使用var语句来进行声明：var 变量名 = 初值;变量命名规则：第一个字符必须是一个字母（大小写均可）、或一个下划线（_）或一个美元符（$）;后续的字符可以是字母、数字、下划线或美元符。全局变量是在函数体之外定义或使用的变量。局部变量是在函数体内部定义或使用的变量。运算

32、符与c、Java基本一致。控制语句if、for、while语句结构和c、Java基本一致。 返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程298.1.38.1.38.1.3 客户端脚本语言客户端脚本语言 5.函数函数定义function 函数名称（参数表）return 表达式；return表达式不是必需的，函数不需说明返回值和参数类型，可以随意返回值。内置函数javascript语言中包括很多内置的函数，需要时候可以查阅相关手册，这里不再举例。 返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期

33、六大学计算机基础教程308.1.38.1.38.1.3 客户端脚本语言客户端脚本语言 6.数组数组定义的方法：myarray=new Array() 或 myarray=new Array(7)javascript的数组实现是非常灵活的。如果在数组定义的时候没有指定它的大小，那么根据程序的需要它可以自动地伸缩。一个数组元素就是一个变量，可以在数组元素中储存数值、字符串或其它对象。此外，同一个数组中的元素也不必是同一个数据类型的，甚至可以让数组的一个元素又是一个数组。例如：myarray=new Array(11,22,33,new Array(a,b);数组元素的引用方法：myarray(0)

34、或myarray0，下标从0开始。数组也是对象，有Length等属性。返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程318.1.38.1.38.1.3 客户端脚本语言客户端脚本语言 7.对象及其属性对象是面向对象程序设计语言中的概念，虽然面向对象程序设计或面向对象的系统分析这些内容有些高深，但面向对象的思想和概念是比较易懂的，并会逐渐在一般的资料和文献中普及。在JavaScript中，对象表示JavaScript语言可以操作的各个页面元素，与面向对象程序设计语言相比较，JavaScript可以说是基于对象的，但不能说是面向对象的，它

35、不提供对象的封装、继承、多态等功能。因此，JavaScript中对于对象的使用是简单得不能再简单的面向对象形式。每个对象都有一些属性和操作这些属性的方法（方法即函数，表示对象的一个行为动作），二者统称为成员，访问对象的成员的语法形式与其它语言基本一致，使用操作符，如：document代表文档对象，即当前网页。document.formCourse代表当前网页对象的一个属性formCourse，实际上此处formCourse是网页中的一个表单对象名称。document.formCourse.submit()表示调用表单的submit()方法，将表单信息提交给服务器进行处理。使用JavaScrip

36、t对象，首先需要知道有哪些常用内置对象（就是系统已经建立并命名的）、这些内置对象的主要属性和主要方法；然后需要了解如何访问在HTML页面中已经建立的各种类型的各个对象，即访问它们的名字、主要属性、主要方法等。理论上可以自己建立动态对象，但使用较少。 返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程328.1.48.1.48.1.4 主要的服务器端动态网页技术主要的服务器端动态网页技术 1.服务器端动态网页HTML是编制网页的基本语言，但它只能用于静态的网页。虽然上面提到的DHTML可以创建动态网页，但那只是客户端的动态。当今的Web已

37、经不再是早期的静态信息发布平台，客户不仅需要Web提供所需的信息，还需要提供个性化搜索、收发e-mail、网上销售、电子商务等活动。为实现以上功能必须使用更新的网络编程技术制作真正的动态网页。这里的所谓动态，指的是服务器端按照访问者的不同需要，对访问者输入的不同信息产生不同的响应页面。 返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程338.1.48.1.48.1.4 主要的服务器端动态网页技术主要的服务器端动态网页技术 2.动态网页原理动态网页技术的原理是将使用各种技术编写的动态页面保存在WEB服务器内，当客户端用户向WEB服务器发

38、出访问动态页面的请求时，WEB服务器将根据用户所访问页面的后缀名确定该页面所使用的网络编程技术，然后把该页面提交给相应的解释引擎；解释引擎扫描整个页面找到特定的标签，并执行位于该标签内的脚本代码以实现不同的功能，如访问数据库、发送电子邮件、执行算术或逻辑运算等，最后把执行结果（以HTML元素形式）返回WEB服务器；最终，WEB服务器把解释引擎的执行结果连同页面上的HTML内容以及各种客户端脚本一并传送到客户端。虽然客户端用户所接收到的页面与传统页面并没有任何区别，但实际上页面内容已经经过了服务端处理，完成了动态的个性化设置。目前实现动态网页主要有4种技术，CGI技术、ASP技术、PHP技术、J

39、SP技术。从形式上看，后三种都属于嵌入式的脚本语言，即嵌入到HTML语言（普通说成页面）中的一种脚本语言。 返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程348.1.48.1.48.1.4 主要的服务器端动态网页技术主要的服务器端动态网页技术 3CGI技术CGICommon Gateway Interface，公用网关接口。它可以称之为一种机制。程序员可以使用不同的程序语言编写合适的CGI程序，如Visual Basic、Delphi或C/C+等，将已经写好的程序放在WEB服务器的计算机上运行，再将其运行结果通过WEB服务器传输到客

40、户端的浏览器上。通过CGI建立WEB页面与脚本程序之间的联系，并且可以利用脚本程序来处理访问者输入的信息并据此作出响应。使用CGI的编程方式比较困难而且编程和调度效率都较低。最常用于编写CGI技术的语言是Perl（Practical Extraction and Report Language，文字分析报告语言），它具有强大的字符串处理能力，特别适合用于分割处理客户端Form提交的数据串，用它来编写的程序后缀为.pl。 返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程358.1.48.1.48.1.4 主要的服务器端动态网页技术主要的

41、服务器端动态网页技术 4.ASP技术(1/3)Active Server Pages即ASP，是微软开发的一种类似HTML（Hypertext Markup Language超文本标识语言）、Script（脚本）与CGI（Common GAteway Interface通用网关接口）的结合体，它没有提供自己专门的编程语言，而是允许用户使用包括VBScript，JavaScript等在内的许多已有的脚本语言编写ASP的应用程序。ASP的程序编制比HTML更方便且更有灵活性。它是在WEB服务器端运行，运行后再将运行结果以HTML格式传送至客户端的浏览器。ASP比CGI具有的最大好处是可以包含HTM

42、L标签，也可以直接存取数据库及使用无限扩充的ActiveX控件，因此在程序编制上要比HTML方便而且更富有灵活性。ASP吸收了当今许多在其之前已经出现的技术，是一种发展较为成熟的网络应用程序开发技术；其核心技术是对组件和对象技术的充分支持。通过使用ASP的组件和对象技术，用户可以直接使用ActiveX控件，调用对象方法和属性，以简单的方式实现强大的功能。 返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程368.1.48.1.48.1.4 主要的服务器端动态网页技术主要的服务器端动态网页技术 4.ASP技术(2/3)ASP中最为常用的内

43、置对象和组件如下：Request对象用来连接客户端的Web页（.htm文件）和服务器端的Web页（.asp文件），可以获取客户端数据，也可以交换两者之间的数据。Response对象用于将服务端数据发送到客户端，可通过在客户端浏览器显示，用户浏览页面的重定向以及在客户端创建cookies等方式进行。该功能与Request对象的功能恰恰相反。Server对象许多高级功能都靠它来完成，它可以创建各种Server对象的实例以简化用户的操作。Application对象它是个应用程序级的对象，用来在所有用户间共享信息，并可以在Web应用程序运行期间持久地保持数据。同时如果不加以限制，所有客户都可以访问这个

44、对象。 返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程378.1.48.1.48.1.4 主要的服务器端动态网页技术主要的服务器端动态网页技术 4.ASP技术(3/3)Session对象它为每个访问者提供一个标识，Session可以用来存储访问者的个人特征信息。在购物网站中，Session常用于创建购物车（Shopping Cart）。Browser Capabilities（浏览器性能组件）可以确切的描述用户使用的浏览器类型、版本以及浏览器支持的插件功能。使用此组件能正确地裁剪出自己的ASP文件输出，使得ASP文件适合于用户的浏览

45、器，并可以根据检测出的浏览器的类型来显示不同的主页。FileSystem Objects（文件访问组件）允许ASP访问文件系统、处理文件。ADO（数据库访问组件）它是最有用的组件，可以通过ODBC实现对数据库的访问。Ad Rotator（广告轮显组件）专门为出租广告空间的站点设计的，可以动态地随机显示多个预先设定的BANNER广告条。ASP技术有一个缺陷：它基本上是局限于微软的操作系统平台之上。ASP主要工作环境是微软的IIS服务器，又因ActiveX对象具有平台特性，所以ASP技术不能很容易地实现在跨平台的WEB服务器的工作。 返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束

46、2022年7月16日星期六大学计算机基础教程388.1.48.1.48.1.4 主要的服务器端动态网页技术主要的服务器端动态网页技术 5JSP技术(1/3)JSP（Java Server Pages）是由Sun Microsystem公司于1999年6月推出的新技术，是基于Java Servlet以及整个Java体系的Web开发技术。利用这一技术可以建立先进、安全和跨平台的动态网站。总的来讲，Java Sever Pages（JSP）和微软的Active Sever Pages（ASP）在技术方面有许多相似之处。两者都是为基于WEB应用的动态交互网页制作提供的技术支持。而且两者都能够替代CGI

47、使网站建设与发展变的较为简单与快捷。不过两者是来源于不同的技术规范组织，ASP一般只能应用于Windows平台，而JSP则可以不加修改地在85%以上的Web Server上运行，其中包括了Windows平台，符合“一次编写，多平台运行”的Java标准，实现平台和服务器的独立性，而且基于JSP技术的应用程序比基于ASP技术的应用程序易于维护和管理。 返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程398.1.48.1.48.1.4 主要的服务器端动态网页技术主要的服务器端动态网页技术 5JSP技术(2/3)JSP技术具有以下的优点：将内

48、容的生成和显示进行分离使用JSP技术特别适合于进行多级应用程序的开发，Web页面开发人员可以使用HTML或者XML标识来设计和格式化最终页面，使用JSP标签以及少量Java脚本来生成页面上的动态内容，这称为表示层；进行数据处理的商业逻辑层被封装在JavaBeans组件中，被JSP标签以及Java脚本访问；底层是数据层，一般使用数据库来完成。这种分层结构清晰并易于设计和维护，适合于大规模的软件分工、协作开发，并且网络的安全性也好，代码的可重用性也高。强调可重用的组件绝大多数JSP页面依赖于可重用的，跨平台的组件（JavaBeans或者Enterprise JavaBeans）组件）来执行应用程序

49、所要求的更为复杂的处理。开发人员能够共享和交换执行普通操作的组件，或者使得这些组件为更多的使用者或者客户团体所使用。基于组件的方法加速了总体开发过程，并且使得各种组织在他们现有的技能和优化结果的开发努力中得到平衡。 返 回第第8 8章章 网页制作技术网页制作技术 首页首页结束结束2022年7月16日星期六大学计算机基础教程408.1.48.1.48.1.4 主要的服务器端动态网页技术主要的服务器端动态网页技术 5JSP技术(3/3)采用标识简化页面开发Web页面开发人员不会都是熟悉脚本语言的编程人员。JavaServer Page技术封装了许多功能，这些功能是在易用的、与JSP相关的XML标识

50、中进行动态内容生成所需要的。标准的JSP标识能够访问和实例化JavaBeans组件，设置或者检索组件属性，下载Applet，以及执行用其他方法更难于编码和耗时的功能。JSP的适应平台更广这是JSP比ASP的优越之处。几乎所有平台都支持Java，JSP+JavaBean可以在所有平台下通行无阻。NT下IIS通过一个插件就能支持JSP。著名的Web服务器Apache也支持JSP。由于Apache广泛应用在NT、Unix和Linux上，因此JSP有更广泛的运行平台。从一个平台移植到另外一个平台，JSP和JavaBean甚至不用重新编译，因为Java字节码都是标准的与平台无关的。Java中连接数据库的