第2章JSP元素.ppt
《第2章JSP元素.ppt》由会员分享,可在线阅读,更多相关《第2章JSP元素.ppt(119页珍藏版)》请在麦多课文档分享上搜索。
1、第2章 JSP元素,本章主要内容,常用的HTML标记 JSP指令元素 JSP脚本元素 JSP动作元素 XML与XML文档,2.1 JSP页面的组成元素,2.1.1 JSP页面的组成元素JSP文件是一个文本文件,文件中的内容由若干个元素构成。JSP网页中的元素分类如图2-1示。,2.1 JSP页面的组成元素,2.1 JSP页面的组成元素,2.1.2 常用的HTML标记 HTML (HyperText Markup Language,超文本标记语言)不是程序设计语言,而是一组标记,便于网页设计人员把文本、图像、动画等制作成有一定效果的网页,资源间通过超链接联结成为一个有机的整体。,2.1 JSP页
2、面的组成元素,HTML文件的基本结构包括文件头(Head)和文件体(Body)两大部分,头部为浏览器提供所需的描述信息,主体则包含待显示的内容。 HTML文本由浏览器解释并还原出页面效果。,2.1 JSP页面的组成元素,HTML标记是用尖括号标识的字符串,尖括号中的英文名叫标记名(如),标记名与左边的“标记可定义字体、字号和字的颜色等。,2.1 JSP页面的组成元素,大部分HTML标记是成对出现,不带“/”的叫起始标记,带有“/”的叫结束标记。标记的属性参数一般写在起始标记内。起始标记和结束标记间的对象称为标记体,标记的效果作用在标记体上,例如: JSP程序设计,2.1 JSP页面的组成元素,
3、当一个标记对没有标记体时,称之为空标记,此时可用简写式来表示,即:在起始标记的“”字符前加上“/”,并把结束标记省略不写。如: ,2.1 JSP页面的组成元素,1、文件标记 文件标记在HTML文件中,用于指出HTML文件的各组成部分。HTML文件标记一般只出现一次,如果重复出现,一些早期的浏览器可能无法正常解释。,2.1 JSP页面的组成元素,(1) 标记 标记表示HTML文件从此处开始,到标记结束,这对标记处在最外层,网页的内容写在此标记内。,2.1 JSP页面的组成元素,(2) 标记 这对标记表示此处是HTML文档的文件头。文件头内部的信息一般不会在浏览器的正文区显示。此标记对内可以插入其
4、它标记,如网页标题标记。,2.1 JSP页面的组成元素,(3) 标记 这对标记表示此处是网页的主体,一般不能省略,标记体的内容在浏览器正文区中显示,例如文字、图片和超链接等。,2.1 JSP页面的组成元素,2、排版标记 (1)标记 标记在HTML文件中作注释用,对网页中的代码作说明,可以放在网页中的任何位置。注释内容会返回到客户端浏览器上,但不显示。在IE5浏览器中,通过菜单【查看】【源文件】,可以看到注释。,2.1 JSP页面的组成元素,(2)标记 标记对用于标识一个段落,两个相邻的段落间有一空行的间隔。在DreamWeaver8的设计视图模式中,输入文字后按键,会自动产生标记。,2.1 J
5、SP页面的组成元素,(3)标记 这个标记没有结束标记,表示换行。在DreamWeaver8的设计视图中,输入文字后按+组合键,会自动产生标记。标记和都能换行,但换行后,上下两行的间距比较小,标记换行后,上下两行有一空行的间距。,2.1 JSP页面的组成元素,3、字体标记 字体标记包括有: 、等。 1)标记用于定义字体、字号大小和颜色。标记的主要属性有face、size、color。(1)face属性用于设置字体,如:。,2.1 JSP页面的组成元素,(2)size属性用于设置字号,HTML中定义了7种字号,1号最小,7号最大,如:。字号也可以用“磅”(px)表示。 (3)color属性用于设置
6、文本的颜色,color有三种方法来设定颜色,第一种方法是用颜色名称,第二种方法用红、绿和蓝色百分比的RGB值来设定,第三种方法是用十六进制的颜色代号来设定颜色。,2.1 JSP页面的组成元素,如: 颜色设定 颜色设定 颜色设定,2.1 JSP页面的组成元素,4、表格标记 在网页中,表格主要分成排版表格和数据表格两种。 排版表格在浏览器中不显示边线,仅供排版、布局用。 数据表格在浏览器中显示边线或背景色,用于列表显示数据。,2.1 JSP页面的组成元素,标记表示表格的开始,表示表格到此结束。 表示表格中的一行。 间如果有n对标记,表示此表格有n行。 表示一行中的一列,一般写在内。,2.1 JSP
7、页面的组成元素,、间的嵌套关系为:,2.1 JSP页面的组成元素,【例2-1】用DW8制作一个3行3列的细线数据表格,表格宽400像素,边线粗细为1个像素,边线颜色为红色。操作步骤如下: 第一步:启动DW8,在【文件】窗口中单击右键,在弹出的快捷菜单中选择【新建文件】,自动生成一个JSP页面文件,将其更名为exam201.jsp。双击exam201.jsp文件,打开供编辑,确定当前文档视图为设计视图。,2.1 JSP页面的组成元素,第二步:插入表格。使用菜单【插入】【表格】,在对话框中填写如下参数:行数为3,列数为3,表格宽度为400像素,边框粗细为0,单元格边距为0,单元格间距为1,单击“确
8、定”按钮后编辑区中插入了一个表格。,2.1 JSP页面的组成元素,第三步:定义表格的背景色为红色。在编辑区中单击表格的边线,选定整个表格,属性面板上,背景颜色选择红色(#FF0000)。 第四步:定义单元格的背景色为白色。用鼠标左键拖动选定表格中的所有单元格,在属性面板中,定义单元格的背景色为白色(#FFFFFF),至此,细线表格生成。,2.1 JSP页面的组成元素,第五步:预览。用快捷键+S保存文档,启动Tomcat,按预览exam201.jsp,即可看到网页上的细线表格。 以上操作录相请参考电子资源包democh2exam201.exe文件。,2.1 JSP页面的组成元素,5、表单 表单是
9、系统和用户交互的手段之一。用户在表单中填写数据,提交后,表单中的数据传递给后台程序处理,实现了客户端和服务器的交互。,2.1 JSP页面的组成元素,(1)和标记标记表示表单的开始和结束。在表单标记中可以存放各种表单元素,如文本域、按钮等。一个表单元素相当于一个变量,它的取值相当于变量的取值。 标记中的id和name属性均为表单的ID名,用于在当前网页中标识表单,在当前网页中此ID名应该唯一。,2.1 JSP页面的组成元素,中action属性值为后台表单处理程序的URI,本例指定用exam.jsp来处理表单数据。 标记中的method属性表示数据的提交方式,一般有GET和POST两种方式。GET
10、方式将表单中的数据按照“变量名=变量值”的形式附加在URL的查询串中,各个变量之间使用“&”连接。,2.1 JSP页面的组成元素,本例如果采用GET方式提交数据,则相应的URL类似于: http:/127.0.0.1:8080/exam.jsp?name=user1&Submit=%CC%E1%BD%BB,2.1 JSP页面的组成元素,用GET方式提交表单数据的优点是速度快,缺点是变量值会在浏览器的地址栏中显示,并且URL的长度有限制,一次所能提交的数据量有限。 如果用POST方式提交表单数据,表单数据按“变量名=变量值”的形式存放在HTTP请求报头尾部的数据体中,表单数据不会显示在URL中。
11、,2.1 JSP页面的组成元素,(2)文本域标记 文本域表单的常见用法如:标记表示此标记是写入标记,存储用户写入的信息。标记中的id和name属性为文本域的ID名,type属性表示此写入标记的类型,value属性存储文本域的值。,2.1 JSP页面的组成元素,多行文本框用文本区域表单元素实现,它的HTML标记使用格式如下: 内容 name属性是文本区域的名字。由于多行文本框可以输入较多的内容,所以把写入的内容存储在标记体中。,2.1 JSP页面的组成元素,(3)单选按钮 在实际应用中的“性别”信息一般通过单选按钮采集,用户在给定的“男”和“女”两个选项中选择其中一个,相应的HTML代码如:,2
12、.1 JSP页面的组成元素,(4)复选按钮 在实际应用的“爱好”信息一般通过复选按钮采集,用户在列出的多个爱好中作出选择,可以选零个,也可以全选,相应的HTML代码如:,2.1 JSP页面的组成元素,(5)隐藏表单域 隐藏表单域是不可视的表单元素,用于存储隐含信息,例如将用户的登录信息存储在隐藏表单域中,用户提交表单后,隐藏表单域中的信息也会被提交给服务器。隐藏表单域记录的是“name=value”形式的信息,它的HTML标记类似于:,2.1 JSP页面的组成元素,(6)列表表单元素 列表表单元素预先把一组可供选择的数据存储在列表中,以下拉菜单或列表的形式供用户在其中选择,其中name是选项的
13、提示文字,value才是选项的值。它的HTML标记形如:,公司员工在校学生公务员 ,2.1 JSP页面的组成元素,(7)文件域表单元素 文件域表单由一个文本域和一个按钮组成,单击按钮后会激活一个文件选择对话框,从本地磁盘中选择一个文件,被选中文件的路径及文件名自动填写在文本域中。上传文件时,需要用到文件域。文件域的HTML标记形如:,2.1 JSP页面的组成元素,6、超链接 标记的href属性可以定义超链接,它的一般用法是: 下一页 href属性值为目标资源的URL,如果是空链接,则URL写为“#”。,2.1 JSP页面的组成元素,【例2-2】用DW8设计一个会员注册的JSP页面,如图2-2示
14、。用户名文本域的名称为userName,口令文本域的名称为password。性别用单选按钮实现,名称为sect,可选值为“男”、“女”。爱好为复选按钮,名称为hobby,可选值有“篮球”、“排球”和“足球”。开户行是下拉列表,名称为bankAccount,可选值有“中国银行”、“工商银行”、“建设银行”。附言是多行文本域,名称为memo。最后是提交按钮,以POST方式提交给exam303.jsp页面。,2.1 JSP页面的组成元素,2.1 JSP页面的组成元素,操作步骤如下: (1)启动DW8,在【文件】窗口中合适的位置上单击右键,在弹出的菜单中选择【新建文件】,将新生成的JSP页面改名为ex
15、am202.jsp,双击打开供编辑。 (2)插入表单:使用菜单【插入】【表单】【表单】,单击选中表单的红色边框,在属性面板上的【动作】项中输入“exam303.jsp”作为后台处理程序,在【方法】项中选中“POST”。,2.1 JSP页面的组成元素,(3)按图2-2的要求,在表单内制作出题目所要求的表单。 (4)保存文档。使用菜单【文件】【保存】,或用快捷键+S。 (5)预览。启动Tomcat,在DW8中,按预览当前页,则IE浏览器中显示图2-2示的表单。 以上操作录相请参考电子资源包democh2exam202.exe文件。,2.2 JSP注释元素,JSP页面中的注释用于说明程序段的主要作用
16、或程序员的意图,方便日后维护或备忘。JSP页面中的注释主要两种:JSP注释和HTML注释。,2.2 JSP注释元素,2.2.1 JSP注释 JSP注释也叫隐藏注释或服务器端注释,只有打开JSP页面后才能看到它。JSP注释中的内容被编译器忽略,不会出现在Servlet程序中,也不会返回给客户端浏览器。其基本语法为: ,2.2 JSP注释元素,例如:JSP注释在JSP页面上的位置没有统一规定,但习惯上写在程序段前,需要注意:JSP注释属于标记级的注释,不要把它嵌套在类似于“”的标记内。,2.2 JSP注释元素,2.2.2 HTML注释 HTML注释也叫输出注释,属于HTML标记范畴,也是标记级的注
17、释。其基本语法为: | ,2.2 JSP注释元素,HTML注释被JSP编译器视为HTML标记,直接用out.write()方法输出。标记中的注释内容会返回到客户端浏览器,但注释信息不会在浏览器中显示。在HTML注释中,可以使用或等标记输出一些动态的注释信息。,2.3 JSP指令元素,JSP指令元素(Directive Elements)主要供JSP容器使用,为JSP容器提供相关的页面属性信息,用于指示JSP容器如何正确地翻译代码,或者执行特定的操作。 JSP指令元素主要包括三个:include、page和taglib,它们的基本语法格式形如:,2.3 JSP指令元素,2.3.1 include
18、指令元素 1、include指令的基本语法 include指令元素称为文件包含,是在JSP容器把JSP网页翻译成Servlet程序时,将指定文本文件的内容嵌入Servlet程序中,替换include指令。其基本语法为,2.3 JSP指令元素,file属性指出被包含资源的URL,可使用相对路径或绝对路径。绝对路径以Web应用的上下文路径名“/xxxx”开头,如:,2.3 JSP指令元素,2、include指令的使用注意事项 include指令适合于包含静态内容。 include指令是代码静态绑定,被include指令包含的内容在编译时会被静态地嵌入Servlet程序中 。 include指令影响
19、JSP页面的可读性。,2.3 JSP指令元素,2.3.2 page指令元素 page指令用于设置当前JSP页面的属性。 page指令中的属性大多数只需要在JSP页面中定义一次 。 page指令中允许重复使用多次的属性有pageEncoding和import属性等。习惯上,把page指令写在JSP页面的头部。,2.3 JSP指令元素,page指令的基本语法格式如下,2.3 JSP指令元素,1、language属性 这个属性定义JSP页面脚本代码所采用的编程语言,默认值为java。 2、extends属性 JSP页面最终会被JSP容器编译成一个Servlet程序,extends属性用于定义这个Se
20、rvlet程序的父类。,2.3 JSP指令元素,3、import属性 import属性用于导入当前JSP页面中要用到的其它Java类。如果要导入多个Java类,用逗号来分隔它们,例如要导入java.util.*和java.io.*,可写为:也可以分为两行来写,例如:,2.3 JSP指令元素,4、pageEncoding属性 pageEncoding定义当前页面的字符编码标准,默认的字符集为ISO-8859-1,如果页面中有简体中文,则字符集应该定义为GB2312或GBK。,2.3 JSP指令元素,5、contentType属性 contentType属性定义MIME类型(MIME-type)和
21、字符集。 MIME (Multipurpose Internet Mail Extensions,多功能Internet 邮件扩充服务)使用简单的ASCII文本来传递E-mail信息, E-mail中允许包含有任意类型的附件文件。,2.3 JSP指令元素,给HTTP协议附加了MIME-type信息,用于指明HTTP中所传递信息的数据类型,浏览器接收完数据后,按照数据的类型调用合适的软件来处理这些数据。 例如,如果接收到的信息是一个Excel文件,则IE5浏览器会自动启动Excel软件来处理这些信息,如果Excel软件启动失败或客户端找不到Excel软件时,IE浏览器提示用户将接收到的信息另存为
- 1.请仔细阅读文档,确保文档完整性,对于不预览、不比对内容而直接下载带来的问题本站不予受理。
- 2.下载的文档,不会出现我们的网址水印。
- 3、该文档所得收入(下载+内容+预览)归上传者、原创作者;如果您是本文档原作者,请点此认领!既往收益都归您。
下载文档到电脑,查找使用更方便
2000 积分 0人已下载
下载 | 加入VIP,交流精品资源 |
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- JSP 元素 PPT
