计算机网络原理、技术及应用 郝兴伟 22388-00计算机网络ch09

计算机网络原理、技术及应用,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,1,第1章基本通信原理第2章计算机网络技术第3章网络操作系统第4章工作组、域和活动目录第5章常用网络服务及其配置第6章Web服务器的架设和管理第7章Ftp服务器的架设和管理第8章邮件服务器的架设和管理第9章网页设计与超文本标记语言第10章客户端开发与JavaScript脚本语言第11章服务器端开发与ASP技术,目录,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,2,第9章网页设计与超文本标记语言,网站设计概述HTML语言概述常用的HTML标记图像的插入,超级链接表格设计表单设计框架,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,3,9.1网站设计概述,9.1.1站点的规划与设计9.1.2网页设计要遵循的基本原则9.1.3网页的三层结构,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,4,9.1.1站点的规划与设计,创建一个Web站点，大体可分为五个阶段:分析阶段设计阶段实现阶段测试阶段维护阶段,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,5,9.1.2网页设计要遵循的基本原则,速度优先原则网页标题的设计原则网页的常见常新原则网页艺术处理的原则信息交互操作简便的原则易于维护原则,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,6,9.1.3网页的三层结构,结构层：网页结构的设计，包括网页的整体布局，内容的安排等。表示层：用于对网页格式的描述，如页面格式、数据格式（包括文本格式、图像格式等）的设计。行为层：对于一个动态网页，在行为层考虑的是如何让页面上的相关元素“动”起来，或者实现人机之间的交互，对访问者的操作做出必要的反映。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,7,9.2HTML语言概述,9.2.1什么是HTML9.2.2HTML文档的结构9.2.3标记的语法9.2.4注释文本9.2.5转义字符,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,8,9.2.1什么是HTML,HTML是一种实现网页定义的国际通用标准HTML是一种用来制作超文本文档的标记语言在HTML文档中，通过各种标记（Tag）按照语言的语法规则来描述文档在HTML文档中，超级链接扮演着非常重要的角色HTML文件是一种纯文本文件,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,9,浏览器,浏览器是一个非常重要的客户端软件HTML文档的解释由浏览器完成解释后的网页在浏览器的客户区显示具有网络访问的常用辅助功能（收藏、保存、打印等）目前广泛使用的浏览器有多种,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,10,9.2.2HTML文档的结构,HTML文档是纯文本文件，由“显示内容”和“控制语句”两部分组成。控制语句描述了显示内容以何种形式在浏览器中显示，并负责客户与服务器之间的信息交换。控制语句以“标记（Tag）”形式出现，以区分于显示内容。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,11,标记的表示,标记被封装在尖括号（由小于号“”组成）中。一般分首标记和尾标记，他们成对出现。首标注用于开启某种形式的显示，尾标记含“/”以同首标记区分，用于关闭首标记开启的功能。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,12,HTML文档的结构示例,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,13,文档的结构,以标记作为文档标记，表示这是一个HTML文档。文档头部分以为标记，包含文档标题等头部信息。若不需头部信息则此标记可省略。头部信息不在浏览器中显示文档体部分以为标记，标记一般不能省略。无论是数据、数据格式等等文档中除头部信息外的所有内容都包含在文档体中。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,14,9.2.3标记的语法,1.单标记2.双标记,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,15,1.单标记,“单标记”是指只需单独使用就能完整地表达意思的一类标记，它不含尾标记，如标记，它表示换行，而标记则是图片标记。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,16,2.双标记,另一类标记称为“双标记”，它由“首标记”和“尾标记”两部分构成，必须成对使用，其中首标记告诉Web浏览器从此处开始执行该标记所表示的功能，而尾标记告诉Web浏览器在这里结束该功能。首标记名前加一个斜杠“/”即成为尾标记。这类标记的语法是：文档内容其中“文档内容”部分就是要被这对标记施加作用的部分。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,17,3.标记的属性,标记的属性可以分为两类：一般属性和事件属性。前者用来完成标记相关特征的描述，例如字体标记就可以使用face（字体名）、size（大小）和color（颜色）几个属性，通过属性可以完成标记细节的设置。后者是当在标记身上某一事件发生时所进行的处理，如onClick、onLoad等属性。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,18,标记属性的格式,不同的标记所包含的属性集也不同，一个标记可以同时设置多个属性，也可以省略属性，多个属性时各属性之间无先后次序，属性省略时取默认值。其语法是：,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,19,9.2.4注释文本,在HTML文档的任意位置都可以插入注释文本，作为文档的解释，以便于以后阅读。浏览器在显示文档时将自动忽略这些文本。注释文本采用标记“”作为首尾定界符。如：,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,20,9.2.5转义字符,在HTML中有些字符具有特殊的含义，若在数据中包含这些字符，它们将不能正确地显示出来。例如数据中包含“”时，该字符串将会被解释成字体标记。因此，数据中如果包含这些诸如“”之类的字符时，应将其替换为转义字符。转义字符的格式为：”结束，中间为转义字符串，中间不能插入空格。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,21,表9-1常用的转义字符,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,22,9.3常用的HTML标记,9.3.1文档标记9.3.2排版标记9.3.3文本格式标记,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,23,9.3.1文档标记,标记标记标记标记,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,24,标记,文档体标记。之间的是文档体的内容。文档体由数据和一系列的控制语句构成，是文档的主体部分。另外标记还具有许多属性，见下表所示。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,25,表9-2标记的常用属性,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,26,HTML中颜色的取值,HTML中规定采用RGB颜色表示法，即通过红、绿、蓝三色的组合表示一种颜色，可以选用以下三种方法之一描述：用颜色常量名表示。用六位十六进制表示：前两位表示红色值、中间两位为绿色值、后两位为蓝色值。数字以“#”号开头。用RGB表示法：格式是：RGB(红色值,绿色值,蓝色值)其中：颜色值的到值范围为0255，或者取值为百分比0100%,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,27,【例9.1】,唐诗欣赏水口行舟（朱熹）昨夜扁舟雨一蓑，满江风浪夜如何？今朝试卷孤篷看，依旧青山绿树多。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,28,9.3.2排版标记,标记、.、标记标记标记,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,29,1标记,双标记。标记是用来创建一个段落的标记，此标记之间的文本将按照段落的格式在浏览器中显示。另外，标记还可以使用align属性，它用来说明对齐方式，语法是：。align可以是left(左对齐)、center(居中)和right(右对齐)三个值中的任何一个。如表示标记对中的文本使用居中的对齐方式。另外，通过它的Style属性也可以设置段落的行间距和段前段后间距。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,30,2、.、标记,双标记。是六种不同等级的标题标记。标题的文字字号最大，字号最小。也可以在标题标注中加入Align属性，以定义标题文本的对齐方式。例:，将对文本“MyCenteredHeading”以标题h1格式居中显示。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,31,3标记,单标记。用来创建一个回车换行。在使用上具有一定的技巧，如果把加在标记对的外边，将创建一个大的回车换行，即前边和后边的文本的行与行之间的距离比较大，若放在的里边则前边和后边的文本的行与行之间的距离将比较小。只是起显示文本的换行作用，该标记前后的文本仍是一个段落。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,32,4标记,单标记。在HTML文档中该位置加入一条水平线，它可以直接使用，具有Size、Color、Width和Noshade属性。Size是设置水平线的厚度，而Width是设定水平线的宽度，默认单位是像素。Color属性表示水平线的颜色。Noshade属性不用赋值，而是直接加入标记即可使用，它是用来加入一条没有阴影的水平线。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,33,9.3.3文本格式标记,标记、和标记和标记,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,34,1标记,双标记。用来设置页面文本字体格式，它使用最多的三个属性是Face、Size和Color。Face可以用来指定文本的字体；Size属性用来指定字体的大小，也可以取值为：-1、1和+1，以使文字变大一号或缩小一号；而Color属性则用来设置文本的颜色。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,35,2、和标记,双标记。指定文本为粗体；指定文本为斜体；指定文本加下划线。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,36,3和标记,双标记。为指定下标文本；指定上标文本。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,37,【例9.2】,文本标志的综合示例/head粗体字文本斜体字文本下划线文本y3=x2+1文本格式设置示例,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,38,9.4图像的插入,网页制作中经常需要在页面上插入图像，一方面它可以为网页增辉，吸引访客；另一方面，也是通过图片向观众传递更加丰富的信息。图像在网页中的出现使页面绚丽多彩起来。在HTML中图像的插入是通过单标记标记实现的，可以插入多种不同格式图片，如Bmp、Gif、Jpg等。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,39,标记的src属性,标记最主要的属性是Src，取值是图像文件的URL，客户端浏览器可根据Src属性所指示的路径和文件名，将图像文件下载到本地机，再显示在页面上的指定位置。在URL中，图像文件的路径一般采用相对路径。所谓文件的相对路径是指相对于当前的HTML文件，被插入图像的源文件的位置所形成的路径。如当前的HTML文件与某图形文件logo.gif在同一个文件夹下，则可以将代码写成；假如图形文件放在当前HTML文档所在文件夹的一个子文件夹(子文件夹名假设是images)下，则代码应为；,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,40,标记的其他属性,除Src属性外，标记还有以下属性：Alt：图像不能下载时的替代文字。Align：对齐方式，取值可以是top（文本向上对齐）、bottom（文本向下对齐）、middle（文本中间对齐）、left（图形靠左边对齐）和right（图形靠右边对齐）。Border：图像的边框，可以取大于或者等于0的整数，默认单位是像素。Width和Height：图像的宽和高，默认单位也是象素。HSpace和VSpace：图片的水平位置和垂直位置，以像素为单位。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,41,【例9.3】,图片插入示例图片插入示例图形两边对齐.(注：此处省略大量文字).图形两边对齐,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,42,9.5超级链接,在HTML文档中超级链接占有重要的地位，正是通过它，我们才可以不断地在不同的页面、站点之间跳转，实现网络空间的漫游。超级链接是通过标记来实现的，为双标记，标记内加入需要在浏览器中显示的链接文本或图像。网页显示时，已经增加超级链接的文本默认格式为蓝色带下划线，访问过的超级链接文本颜色默认为紫色，可以通过标记的link和vlink属性修改超级链接的颜色。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,43,9.5超级链接,9.5.1超链接标记的属性9.5.2书签的应用,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,44,9.5.1超链接标记的属性,Href属性：指明要链接对象的URL。超级链接可以链接到多种不同的网络资源，所以在URL中网络资源可以是http:/（Web资源）、ftp:/（文件资源）、mailto:/（发送邮件）等。资源路径一般采用相对路径，使用最多的就是对Web资源的链接。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,45,Href属性举例,：链接到指定站点的默认文档（首页）。：链接到指定站点的指定文档。：链接到当前文档所在目录下aaa子目录中的指定文档。：启动邮件编辑程序向指定邮箱发送邮件。：链接到指定站点abc.htm文档中的label书签位置。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,46,Target属性,标记可以增加Target属性，此属性用来指明浏览的目标窗口，取值可以是“_self”（当前窗口）、“_blank”（新建窗口）、“_parent”（父窗口）和框架名（当使用了框架结构时，每一个框架都有一个框架名，参见本章中关于框架的讨论）。当未使用target属性时，目标文档将默认在当前窗口中打开。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,47,【例9.4】,链接标记首都在线lftp272.zip北大bbs,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,48,9.5.2书签的应用,书签也称为“锚点”，是指为文档页面的某一位置插入的位置标识，就像我们在阅读一本书时，为了标识下次继续阅读的开始位置而在该页放置一个书签一样。超级链接可以链接到书签位置，使网页显示出从书签位置开始。通过标记可以完成书签的建立。其Name属性为书签名。在建立书签时属性name是不可缺少的，并且不能添加其他属性。例如：，在文档中插入了一个名为“车市报价”的书签。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,49,对书签的链接,在当前文档中，如果要链接到一个书签位置，可以写为：。如果要链接到某一文档的某书签位置，可以写为：.注意：标签名前边加的“#”号不能省略。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,50,9.6表格设计,表格（Table）是网页制作中安排布局最好的工具，因为表格不但可以很好的安排文本或图像的显示位置，而且还可以随意地进行背景和前景颜色的设置。通过表格的合并和嵌套可以设计出任意结构的页面布局。9.6.1表格结构及表格标记9.6.2表行、表头与单元格的标记9.6.3表格的标题标记9.6.4应用举例,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,51,9.6.1表格结构及表格标记,一个规则的表格我们可以看成为一组单元格构成的阵列，它由若干个表行组成，每一个表行中又包含若干个单元格。在同一个规则表格中，各个表行的单元格个数是相同的。在一个规则的表格中，单元格是包含数据的基本对象。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,52,表格结构分析,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,53,HTML文档表格标记的结构,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,54,标记,为双标记，用来创建一个表格，标记对之间包含若干，一个标记对对应表格的一行。每一个标记对又包括若干个标记对，它对应一行中的一格单元格。标记有许多属性，用来定义表格的外观特性，通过表格属性可设置表格的外观。表格的缺省属性设置为为无边框，并根据内容自动设定表格大小。详细表格属性见下表。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,55,表9-3标记的常用属性,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,56,9.6.2表行、表头与单元格的标记,一个表格有若干行（Row）构成，每一行又有若干个单元格（Cell）组成，另外一个表格还可能具有一个标题（Head）。这三个标记都是双标记，为表行标记；为表头单元格标记；为数据单元格标记。中的数据自动加粗并且居中显示，其他方面与标记完全一样。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,57,标记,除具有与相同的属性外，还具有Colspan、Rowspan和Nowrap属性。单位用绝对像素值或总宽度的百分比；Colspan设置一个单元格跨占的列数(缺省值为1)，它是一个小于表的横向单元格数的整数；Rowspan设置一个单元格跨占的行数(缺省值为1)，应小于纵向单元格数。通过Rowspan和Colspan两个属性，可实现单元格的合并。Nowrap禁止单元格内的内容自动换行。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,58,的align和valign属性,align是水平对齐方式，取值为left(左对齐)、center(居中)、right(右对齐)；而valign是垂直对齐方式，取值为top(靠顶端对齐)、middle(居中间对齐)或bottom(靠底部对齐)。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,59,9.6.3表格的标题标记,为双标记，为表格的标题，一般出现在首标记与第一个标记之间。具有Align和Valign属性。设置水平和垂直对齐方式。水平位置属性Align的取值可以是left、center、right、top、middle、bottom。垂直位置属性valign的取值可以是top、bottom。表格标题行置于表格的上方和下方，可设置Align为top或bottom，也可设置Valign为top或bottom，两者效果是一样的。但是如果要标题于表格下方及右或左对齐，则两个属性必须一同使用。当只一个属性时，请首选Align，因为Valign属性是由HTML3.0才开始使用的属性。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,60,9.6.4应用举例,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,61,示例的结果,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,62,9.7表单设计,表单（Form）在Web网页中用来给访问者填写信息，并且能发送这些信息到服务器端。表单的应用使网页增加了与服务器的交互能力。9.7.1标记9.7.2表单控件9.7.3表单应用举例,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,63,什么是表单,表单和Windows的对话框类似，它的子对象称为“控件”，如文本框、按钮、单选按钮等。控件是用户用来完成数据输入的工具，一个表单一般由若干控件组成的。当用户输入完数据后做“提交（Submit）”操作时，表单上输入的数据就从客户端浏览器传输到服务器上，在Web服务器由ASP、JSP或CGI等服务器端程序处理。应该注意的是，一个网页上可以有多个表单，每次提交表单时，只是将当前表单的数据发送到服务器，而对同一网页上的其它表单不起作用。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,64,9.7.1标记,标记为双标记，用来建立一个表单，即定义表单的开始和结束位置，在标记对之间的所有控件标记都是该表单的子对象。标记具有Action、Method、Target和Enctype属性。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,65,Action属性,Action的值是处理程序的网络路径和程序名，如：，当用户提交表单时，服务器将执行网址,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,66,Method属性,Method属性用来设置表单数据的发送方式，可取值为GET或POST。GET方式是将表单处理程序的URL与所有的控件数据形成一个字符串发送到服务器端，然而这种方式传送的数据量限制不能超过512Bytes。POST方式与GET方式不同，它是将处理程序的URL与所有控件数据封装成数据包，直接发送到服务器端。所以这种方式的传送数据量不受限制。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,67,Target属性和Enctype属性,Target属性用来指定目标窗口或帧。Enctype属性用来指定发送数据的编码类型，例如表单上含有上传文件时需要指定该属性为：Enctype=Multipart/form-data,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,68,9.7.2表单控件,控件是表单的子对象，用户的所有输入与选择都是通过它完成的。控件有多种不同的类型，以实现不同形式的数据输入与操作。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,69,1标记,为单标记，可以用来定义多种不同的表单控件。标记最重要的属性就是Type。通过该属性来指定控件的类型，如表9-4所示。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,70,表9-4Type属性,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,71,(1)单行文本框,表单上的单行文本可以接收用户输入的任何字符串数据，不能包含换行符，数据必须在一行中写完。其基本形式如下：其中：field_name为控件名；Value为文本框的初值；n为文本框的宽度（以字符数为单位）；m为字符串的最大字符数；Readonly用来指定控件是否是“只读”的。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,72,(2)复选框,复选框是表单上可供用户选择输入的控件，有“选中”和“不选中”两种状态。选中时将在控件中打上“”。其基本形式如下：其中：field_name为控件名；含有Checked属性时，表示控件的默认状态为“选中”。复选框控件后面一般带有文字说明，,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,73,(3)单选按钮,单选按钮是从多个选项中选择其中之一的控件。在一组单选按钮中一次只能选择一项。选中的中间有一黑点，否则为不选中。当选择另一个单选按钮时，原来的选中将自动取消。该控件的HTML语句的基本形式为：其中：field_name为控件名；value为选中该项时的取值；当语句中有Checked属性时，为该项默认为“选中”状态。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,74,应用单选按钮时应注意的问题,单选按钮应成组出现；同一组的控件名必须相同；同一组的按钮只有一个为默认选中状态，不指定默认选项时以第一个为默认“选中”的选项；同一组的各选项的Value属性值不要相同。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,75,(4)密码框,密码框同文本框，所不同的是密码框中显示的数据为“*”所替代，从而起到保密的作用。其基本形式为：其中的各属性见文本框控件。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,76,(5)提交按钮,按钮控件用来将表单的输入（或选择）内容发送到Web服务器。发送的方式以及在服务器端对数据的处理程序由表单标记的Method属性和Action属性指定。其基本形式如下：其中的caption_name为按钮上的文字。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,77,(6)重设按钮,单击该按钮时将使表单上的所有控件恢复默认值。其基本形式如下：其中Value属性值同提交按钮。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,78,(7)按钮控件（Button）,按钮控件可以用来完成任何指定的工作。常常用它来实现一些客户端的数据处理工作和客户端的相关操作。其基本形式如下：其中的Value属性值同提交按钮。按钮控件通过onClick属性响应点击事件，以完成指定的工作，如调用一个JavaScript函数、执行一条命令等。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,79,(8)提交图片（Image）,提交图片的作用与提交按钮（Submit）完全一样，只是用一个图片来替代按钮，当用户点击图片时，可以将表单上的输入数据发送到服务器端。其基本形式为：其中的image_filename为图片文件的URL。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,80,(9)隐藏控件（Hidden）,该控件不可显示，可以用来传送数据给Web服务器,主要是利用它保存与传输一些不宜在表单上显示的数据。其基本形式如下：其中的Value属性值即为它的数据。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,81,(10)文件上传（File）,该控件包含一个文本框和一个“浏览.”按钮，可以由用户输入或选择一个本地机或上的文件。当单击表单上的“提交”控件时，该文件可以上载到服务器端。其基本形式如下：,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,82,2、标记,标记对用来创建一个下拉列表框或列表框。为双标记，其基本形式如下：具有Multiple、Name和Size属性。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,83,标记的属性,加入Multiple属性的列表可以进行多项选择。Name是此列表框的控件名属性。Size属性用来设置列表的高度，缺省时值为1，显示的将是一个下拉式列表。当含有Multiple属性或Size值大于1时，它将是普通的列表。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,84,标记,为双标记，用来指定列表中的选项，它放在标记对之间。基本形式如下：选项文本此标记的Selected属性用来指定默认的选项，Value属性用来指定该选项的取值，即当用户选中该项时，控件将取该值为当前值，发送时它与的Name属性值一起传送到服务器。当标记不含有Value属性时，则以选项文本作为选中后的取值。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,85,3标记,为双标记，用来创建一个多行文本框。基本形式如下：初值文本该控件具有Name、Cols和Rows属性。Cols和Rows属性分别用来设置文本框的列数和行数，列数以字符数为单位。在首尾标记之间的所有文本都是该控件的初值。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,86,9.7.3表单应用举例【例9.6】,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,87,【例9.6】（续）,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,88,【例9.6】显示效果,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,89,9.8框架,框架（frame）也称为帧，可以用来将浏览器窗口划分为多个区域（即窗格），每个框架中装载一个HTML文件。即每个HTML文件占据一个框架，而多个框可以同时显示在同一个浏览器窗口中，它们组成了一个最大的框架，也即是一个包含多个HTML文档的HTML文件（称为主框架）。框架的使用有效地利用了窗口空间，将窗口划分成了“动”与“静”的不同区域，通过脚本程序的控制，大大增强了网页的动态性和交互性，减少了刷新页面时的数据更新量。,高等教育“十一五”国家级规划教材计算机网络原理、技术及应用,90,9.8.1框架的定义标记