INPUT TYPE= SUBMIT VALUE=”发送">< INPUT TYPE= RESET VALUE="重设”> <FORM> BODY> </HTML> (2)复选框( Checkbox)和单选框( Radio button) HTMl> <HEAD> <∏ILE>这是个测试页</mLE> </HEAD> <BODY> <FORM ACTION=REGL ASP METHOD=POST> 选择一种你喜爱的水果 <br>< INPUT types= radio name=水果 value=”香蕉”>香蕉 <br>< INPUTtype=radio name=水果 checked value=草莓”>草莓 <br>< INPUT type=radio name=水果 value="橘子">橘子 <br>选择你所喜爱的运动 <br>< INPUT type=" checkbox"name= ral checked value="足球">足球 <br>< INPUT type=" checkbox"name=ra2 checked value="篮球">篮球 <br>< INPUT type=" checkbox"name=ra3vaue="排球">排球 br>< INPUTTYPE= SUBMIT VALUE=发送">< INPUT TYPE= RESET VALUE="重设"> </FORM> </BODY> C /HTML> (3)按钮的制作 在上面几个例子中,都有两个按扭,一个是“发送”按钮,另一个“重置”按钮。其实“发送”按 钮真正的含义叫“提交”即当 Internet网络用户用鼠标单击这个按钮后,用户输入的信息便提 交给一个驻留在Web服务器上的程序,让服务器进行处理,其典型的格式:< INPUT TYPE= SUBMIT VALUE=”发送”>。提交按钮在FORM中是必不可少的,前几个例子只是 说明 INPUT语句中类型的使用,作为FORM语句并不完整,每个FORM中有且仅有一个 提交按钮。当设置“提交”按钮标记时,如果缺省ⅥALUE属性,则浏览器窗口中的按钮上出 现“ SUBMIT"的字样,这个字样也可以自己设定,改变按钮上的提示。例如:VLUE=提交”。 另一种在浏览器常用的按钮叫“重置”按钮,当 Internet网络用户用鼠标单击这个按 钮后,网络用户输入的信息被清除,让网络用户重新输入信息。其典型的格式:< INPUT TYPE “ RESET” VALUE=”重新输入”>,而且在这个标记设置中如果缺省ⅥALUE属性,则浏览器 窗口中的按钮上出现“ RESET”的字样,这个字样也可以自己设定,来改变按钮上的提示,例 如:ⅥALUE=重新输入”。 (4)HIML中的 SELECT标记 在制做HIML文件时,使用<FORM><FORM标记可以在浏览器窗口中设置下拉式菜单 或带有滚动条的菜单, Internet网络用户可以在菜单中选中一个或多个选项 <HTML> <HEAD> <∏ILE>西安电子科技大学<mTLE> 6
6 <INPUT TYPE=SUBMIT VALUE=" 发 送 "><INPUT TYPE=RESET VALUE="重设"> </FORM> </BODY> </HTML> （2）复选框（Checkbox） 和 单选框（Radio Button） <HTML> <HEAD> <TITLE>这是个测试页</TITLE> </HEAD> <BODY> <FORM ACTION=“REG1.ASP” METHOD=POST> 选择一种你喜爱的水果: <br><INPUT type=radio name=水果 value=”香蕉”>香蕉 <br><INPUT type=radio name=水果 checked value=”草莓”>草莓 <br><INPUT type=radio name=水果 value="橘子">橘子 <br>选择你所喜爱的运动: <br><INPUT type="checkbox" name=ra1 checked value="足球">足球 <br><INPUT type="checkbox" name=ra2 checked value="篮球">篮球 <br><INPUT type="checkbox" name=ra3 value="排球">排球 <br><INPUT TYPE=SUBMIT VALUE="发送"><INPUT TYPE=RESET VALUE="重设"> </FORM> </BODY> </HTML> （3）按钮的制作 在上面几个例子中，都有两个按扭，一个是“发送”按钮，另一个“重置”按钮。其实“发送”按 钮真正的含义叫“提交”即当 Internet 网络用户用鼠标单击这个按钮后，用户输入的信息便提 交给一个驻留在 Web 服务器上的程序，让服务器进行处理，其典型的格式：<INPUT TYPE=”SUBMIT” VALUE=”发送”>。提交按钮在 FORM 中是必不可少的，前几个例子只是 说明 INPUT 语句中类型的使用，作为 FORM 语句并不完整，每个 FORM 中有且仅有一个 提交按钮。当设置“提交”按钮标记时，如果缺省 VALUE 属性，则浏览器窗口中的按钮上出 现“SUBMIT”的字样，这个字样也可以自己设定，改变按钮上的提示。例如：VALUE=“提交”。 另一种在浏览器常用的按钮叫“重置”按钮，当 Internet 网络用户用鼠标单击这个按 钮后，网络用户输入的信息被清除，让网络用户重新输入信息。其典型的格式：<INPUT TYPE = “RESET” VALUE=”重新输入”>，而且在这个标记设置中如果缺省 VALUE 属性，则浏览器 窗口中的按钮上出现“RESET”的字样，这个字样也可以自己设定，来改变按钮上的提示，例 如：VALUE=“重新输入”。 （4）HTML 中的 SELECT 标记 在制做 HTML 文件时，使用<FORM>…</FORM>标记可以在浏览器窗口中设置下拉式菜单 或带有滚动条的菜单，Internet 网络用户可以在菜单中选中一个或多个选项。 <HTML> <HEAD> <TITLE>西安电子科技大学</TITLE>
</HEAD> <BODY> 请从下面课程中选择几门选择课: <FORM action="hl. asp"method=POST id=formI name=form1> <SELECT name=xl multiple> < OPTION>网络技术 <OP∏DON>书法 < OPTION>音乐欣赏 < OPTION>现代文学 <OP∏ON>多媒体技术 <SELECT> 人m早平「鱼扌 ORM景装 <BODY> HTML> 27HIML中的表格 下面看一个表格的例子 从这个例子可以看出一个表格有一个标题( Caption,它表明表格的主要内容,并且一般位 于表的上方;表格中由行和列分割成的单元叫做“表元”(Cell),它又分为表头(用TH标记 来表示)和表数据(用TD标记来表示):表格中分割表示的行列线称为“框线”( B order) 1.表格的标记 个表格的基本框架如下所示 <TABLE WIDTH=75% BORDER=1 CELLSPACING=1 CELLPADDING=1> <CAPTION></CAPTION> <TR> <ID><ID> <TDX</ID> <TD><TD> Ir tata o, hc://:.3-0t1/TMLA. Exe e24 <TR> <ID></ID> IDX<TD> TD><TD> (1) TABLE标记 一个表格至少一个 TABLE标记,由它来决定一个表格的开始和结束,而且 TABLE标记可 以嵌套。 TABLE标记有以下五种属性: BORDER属性,指定围绕表格的框的宽度(只能用像素)。 · CELLSPACING属性,指定框线的宽度 · CELLPADDⅠNG属性,用于设置表元内容与边框线之间的间距 ALIGN属性用来控制表格本身在页面上的对齐方式。其取值可是LEFT(左 对齐)、 CENTER(居中对齐)、RGHT(右对齐) · WIDTH属性,用来设置表格的宽度,可以以像素为单位,也可用占浏览器 窗口的百分比来定义 (2) CAPTION标记
7 </HEAD> <BODY> 请从下面课程中选择几门选择课: <FORM action="h1.asp" method=POST id=form1 name=form1> <SELECT name=x1 multiple> <OPTION>网络技术 <OPTION>书法 <OPTION>音乐欣赏 <OPTION>现代文学 <OPTION>多媒体技术 </SELECT> </FORM> </BODY> </HTML> 2.7 HTML 中的表格 下面看一个表格的例子 从这个例子可以看出一个表格有一个标题（Caption），它表明表格的主要内容，并且一般位 于表的上方；表格中由行和列分割成的单元叫做“表元”（Cell），它又分为表头（用 TH 标记 来表示）和表数据（用 TD 标记来表示）；表格中分割表示的行列线称为“框线”（B order）。 1．表格的标记 一个表格的基本框架如下所示： <TABLE WIDTH=75% BORDER=1 CELLSPACING=1 CELLPADDING=1> <CAPTION></CAPTION> <TR> <TD></TD> <TD></TD> <TD></TD> </TR> <TR> <TD></TD> <TD></TD> <TD></TD> </TR> （1）TABLE 标记 一个表格至少一个 TABLE 标记，由它来决定一个表格的开始和结束，而且 TABLE 标记可 以嵌套。TABLE 标记有以下五种属性： • BORDER 属性，指定围绕表格的框的宽度（只能用像素）。 • CELLSPACING 属性，指定框线的宽度 • CELLPADDING 属性，用于设置表元内容与边框线之间的间距。 • ALIGN 属性用来控制表格本身在页面上的对齐方式。其取值可是 LEFT（左 对齐）、CENTER（居中对齐）、RIGHT（右对齐）。 • WIDTH 属性，用来设置表格的宽度，可以以像素为单位，也可用占浏览器 窗口的百分比来定义。 （2）CAPTION 标记
CAPTION标记用来标注表格标题的。 CAPTION标记必须紧接在 TABLE开始标记之后放在 第一个TR标记之前。通过该标记所定义的表格标题一般显示在表格的上方,而且其水平方 向是居中对齐。另外,如需要对表格的标题突出显示,可以在 CAPTION标记之间加入其它 对字体进行加重显示的标记。如: <TABLE WIDTH=75% BORDER=1 CELLSPACING=1 CELLPADDING=1> CAPTION> <H2>表格标题强调</H2> <CAPTION> <IR> </IR> TABLE (3)TR标记 定义表格的一行。TR标记中有两个属性,一个是ALGN属性,用来设置表行中 的每个表元在水平方向的对齐方式,其取值可以是LEFT(左对齐)、 CENTER(居中对齐) RGHT(右对齐);另一个是VLGN属性,用来设置表行中的每个表元在垂直方向的对齐 方式,其取值可以是TOP(向上对齐)、 CENTER(居中对齐)、 BOTTOM(向下对齐)。例 如,要使表行中各单元的内容水平方向右对齐、垂直方向居中对齐,可使用如下源代码: <TR ALIGN=RIGHT VALIGH=TOP> (4)TD标记 TD标记用来表示一个表行中的各个单元。TD标记内几乎可以包含所有的HML标记,甚 至还可以嵌套表格。该标记与TR标记同样具有ALGN和 VALIGN属性,如果在TD标记 和TR标记中都设置了ALGN和 VALIGN属性,而且它们所设置的属性值不相同,这时以 TH标记所设置的属性值为准。另外,TD标记还有两个属性,一个是WDIH属性,用来 设置表元的宽度,另一个 HEIGHT属性,用来设置表元的高度。这两个属性的取值单位都 是像素。在同一行中将多个表元设置为不同高度,或者在同一列中将多个表元设置为不同宽 度,都有可能导致不可预料的结果 2.表格使用实例 在这个实例中,通过制作一个登记表格来给大家来说明如何制作一个比较复杂的表格。在表 格中经常会出现跨多行、多列的表元,这就要利用TD标记另外两个属性,即 COLSPAN和 ROWSPAN属性。例如 TD COLSPAN=3>登记照</TD> 表示这个表项标题将横跨三个表项的位置 < ID ROWSPAN=3>登记照<TD> 表示这个表项标题将纵跨三个表项的位置 另外每个表元还可以设置其背景颜色。例如 < ID COLSPAN=3 BGCOLOR= yellow>登记照</TD> 还可以在表格中插入超级链接或在表格中插入图片,如果能对这个例子举一反三的 话,那么仅需制作一个无框线的表格,就可以把各种数据按照自己所希望的形式在页面进行 布置。 下面就给出一个具体的实例 HTML> <HEAD><1ITLE>表格综合实例</∏ILE><HEAD> <BODY>
8 CAPTION 标记用来标注表格标题的。CAPTION 标记必须紧接在 TABLE 开始标记之后放在 第一个 TR 标记之前。通过该标记所定义的表格标题一般显示在表格的上方，而且其水平方 向是居中对齐。另外，如需要对表格的标题突出显示，可以在 CAPTION 标记之间加入其它 对字体进行加重显示的标记。如： <TABLE WIDTH=75% BORDER=1 CELLSPACING=1 CELLPADDING=1> <CAPTION> <H2>表格标题强调</H2> </CAPTION> <TR> ………. </TR> </TABLE> （3）TR 标记 定义表格的一行。TR 标记中有两个属性，一个是 ALIGN 属性，用来设置表行中 的每个表元在水平方向的对齐方式，其取值可以是 LEFT（左对齐）、CENTER（居中对齐）、 RIGHT（右对齐）；另一个是 VLIGN 属性，用来设置表行中的每个表元在垂直方向的对齐 方式，其取值可以是 TOP（向上对齐）、CENTER（居中对齐）、BOTTOM（向下对齐）。例 如，要使表行中各单元的内容水平方向右对齐、垂直方向居中对齐，可使用如下源代码： <TR ALIGN=RIGHT VALIGH=TOP> （4）TD 标记 TD 标记用来表示一个表行中的各个单元。 TD 标记内几乎可以包含所有的 HTML 标记，甚 至还可以嵌套表格。该标记与 TR 标记同样具有 ALIGN 和 VALIGN 属性，如果在 TD 标记 和 TR 标记中都设置了 ALIGN 和 VALIGN 属性，而且它们所设置的属性值不相同，这时以 TH 标记所设置的属性值为准。另外， TD 标记还有两个属性，一个是 WIDTH 属性，用来 设置表元的宽度，另一个 HEIGHT 属性，用来设置表元的高度。这两个属性的取值单位都 是像素。在同一行中将多个表元设置为不同高度，或者在同一列中将多个表元设置为不同宽 度，都有可能导致不可预料的结果。 2．表格使用实例 在这个实例中，通过制作一个登记表格来给大家来说明如何制作一个比较复杂的表格。在表 格中经常会出现跨多行、多列的表元，这就要利用 TD 标记另外两个属性，即 COLSPAN 和 ROWSPAN 属性。例如 <TD COLSPAN=3 > 登记照</TD> 表示这个表项标题将横跨三个表项的位置； <TD ROWSPAN=3 > 登记照</TD > 表示这个表项标题将纵跨三个表项的位置； 另外每个表元还可以设置其背景颜色。例如 <TD COLSPAN=3 BGCOLOR=yellow> 登记照</TD> 还可以在表格中插入超级链接或在表格中插入图片，如果能对这个例子举一反三的 话，那么仅需制作一个无框线的表格，就可以把各种数据按照自己所希望的形式在页面进行 布置。 下面就给出一个具体的实例 HTML> <HEAD> <TITLE>表格综合实例</TITLE> </HEAD> <BODY>
<TABLE border=l cellPadding=l cellSpacing=l width=75%"> < aption><h3>大奖赛登记表<h3>< /caption> <TR> tD bgcolor= LightGoldenrodYellow>报名号</TD> <TD>757</TD> < TD bgcolor= LightYellow性别</ID> <TD>女<TD> IDrowspan=2><IMG SRC="image\center.gif"></TD> </IR> <TR> < tD bgcolor= Floral white→姓名</TD> <TDcolspan=3x<ahref="hp/www.jljiangli.com.cn">江小丽<A><TD> </TR> < TD bgcolor= Cornsilk>推荐单位</TD> < TD colspan=4>宇宙公司</TD> L上 三心 <TABLE> 大奖影 <BODY> 67生另 名 <HTML> 若单位学宙谷面 网页脚本语言— JavaScript 21 JavaScript的基础知识 1.什么是脚本语言 脚本语言是一种简单的描术性语言,它是针对HIML语言不能很好地解决动态交互这个缺 点而引入的,它能对Web页面中的元素进行控制。一般来说,脚本语言是通过一个<cip> 的标记嵌入到HIML文档中,并可以被浏览器解释执行,插入的脚本语言就如同子程序 样被HTML元素所调用,成为HTML的一部分。目前比较流行的脚本语言有网景公司 ( Netscape)的 JavaScript和微软公司( Microsoft)的 VBScript。 JavaScript是基于 Netscape浏览器的,类似于Java编程语言的脚本语言,并且是 种基于对象的、面向 Internet或 Intranet的编程语言,使用它可以开发关于 Internet或 Intranet 客户端和服务器的应用程序,也可以方便地嵌入到计算机文件中。由于 JavaScript是第一个 在wwW上使用的脚本语言,因而它一度是最流行的Web站点脚本语言,用它可以方便地 编排HIML网页,同时还可以控制动态HIML Ⅴ SCript是 Microsoft公司在 isual basic编程语言的基础上设计的,由于其在企业 界广为流行,且与 Microsoft公司的其它产品有着密切的联系, VBScript的使用范围越来越 大,逐渐成为一种主要的脚本语言。 2. JavaScript的产生与发展 JavaScript语言起初并不叫此名称,它的早期是 Netscape的开发者们称之为 Mocha”的语言, 开始在网上进行β测试(由软件的多个用户在其实际的使用环境下进行的测试叫β测试〕时 名字改为 LiveScript”,Sun公司推出Java之后, Netscape引进了Sun的有关概念,在其发 行 Netscape20β测试版时才称其为“ Javascript”。它不仅支持Java的 Applet小程序,同时 向web页的制作者提供一种嵌入HIML文档进行编程的、基于对象的 Script(脚本)程序 设计语言,采用的许多结构与Java相似
9 <TABLE border=1 cellPadding=1 cellSpacing=1 width="75%"> <caption> <h3>大奖赛登记表</h3> </caption> <TR> <TD bgcolor=LightGoldenrodYellow>报名号</TD> <TD>757</TD> <TD bgcolor=LightYellow>性别</TD> <TD>女</TD> <TDrowspan=2><IMG SRC="image\center.gif"></TD> </TR> <TR> <TD bgcolor=FloralWhite>姓名</TD> <TD colspan=3><A href="http://www.jljiangli.com.cn">江小丽</A></TD> </TR> <TR> <TD bgcolor=Cornsilk>推荐单位</TD> <TD colspan=4>宇宙公司</TD> </TR> </TABLE> </BODY> </HTML> 二、 网页脚本语言——JavaScript 2.1 JavaScript 的基础知识 1． 什么是脚本语言 脚本语言是一种简单的描术性语言，它是针对 HTML 语言不能很好地解决动态交互这个缺 点而引入的，它能对 Web 页面中的元素进行控制。一般来说，脚本语言是通过一个<Script> 的标记嵌入到 HTML 文档中，并可以被浏览器解释执行，插入的脚本语言就如同子程序一 样被 HTML 元素所调用，成为 HTML 的一部分。目前比较流行的脚本语言有网景公司 （Netscope）的 JavaScript 和微软公司（Microsoft）的 VBScript。 JavaScript 是基于 Netscape 浏览器的，类似于 Java 编程语言的脚本语言，并且是 一种基于对象的、面向Internet或Intranet的编程语言，使用它可以开发关于Internet或Intranet 客户端和服务器的应用程序，也可以方便地嵌入到计算机文件中。由于 JavaScript 是第一个 在 WWW 上使用的脚本语言，因而它一度是最流行的 Web 站点脚本语言，用它可以方便地 编排 HTML 网页，同时还可以控制动态 HTML。 VBScript 是 Microsoft 公司在 Visual Basic 编程语言的基础上设计的，由于其在企业 界广为流行，且与 Microsoft 公司的其它产品有着密切的联系，VBScript 的使用范围越来越 大，逐渐成为一种主要的脚本语言。 2．JavaScript 的产生与发展 JavaScript 语言起初并不叫此名称，它的早期是 Netscape 的开发者们称之为“Mocha”的语言， 开始在网上进行β测试（由软件的多个用户在其实际的使用环境下进行的测试叫β测试）时， 名字改为“LiveScript”， Sun 公司推出 Java 之后，Netscape 引进了 Sun 的有关概念，在其发 行 Netscape 2.0β测试版时才称其为 “JavaScript”。它不仅支持 Java 的 Applet 小程序，同时 向 Web 页的制作者提供一种嵌入 HTML 文档进行编程的、基于对象的 Script（脚本）程序 设计语言，采用的许多结构与 Java 相 似