Html与jsp基础知识

書式設定,書式設定,第,2,第,3,第,4,第,5,*,Html,与,jsp,基础知识,2,HTML(Hyper Text Markup Language),语言简介,超文本标记语言,HTML,源于标准通用化标记语言,SGML,（,Standard General Markup Language,）是,SGML,的子集（,XML,同样也是其子集），由,Web,的发明者,Tim,和,Daniel,于,1990,年创立。,HTML,是一门标记型语言，只要记住各个标记的用法即可,可以用任何文本编辑器来编写,HTML,页面，只要将创建的页面保存为,html,或,htm,即可,在客户端浏览器可以查看所编写的源代码,3,HTML,的编辑环境,所见及所得的编辑器，如：Dreamweaver、FrontPage,任何,文本编辑工具，如：记事本、,EditPlus,HTML,的运行环境,浏览器,Internet Explorer 6,FireFox1.5,由于各浏览器对,HTML,的支持有差别，所以尽量避免使用非规范的,HTML,标记,HTML,文件的基本结构,HTML,文件的基本结构,文档头部分,文档主体部分,HTML,文件的基本结构,第一个,html,网页,超链接,这是我的第一个网页,1.HTML,标记,HTML,标记表示文档内容的开始和结束。,是开始标记，,是结束标记，其他所有的,HTML,代码都位于这两个标记之间,浏览器将该标记中的内容视为一个,Web,文档，按照,HTML,语言规则对文档内的标记进行解释,标记是可选的，但是最好不要省略这两个标记，以保持,Web,文档结构的完整性,2.,首部标记,首部标记中提供与网页有关的各种信息,在首部标记中，一般使用下列标记,.,：制定网页的标题,.,：定义文档内容样式表,.,：插入脚本语言程序,：描述网页信息,3.,标题栏标记,标题栏标记的内容是在浏览器标题栏中显示的文本,通常，,Web,搜索工具用它作为索引,4.,描述标记,描述文档属性参数,5.,正文标记,正文标记的格式如下：,正文标记中包含文档的内容。其常用属性如下：,background,：文档背景图像的,URL,地址,bgcolor,：文档的背景颜色,（,2,）换行标记,该标记强行中断当前行，使后续内容在下一行显示,（,3,）标题标记,标题标记的格式如下：,其常用属性如下：,align,：段落的水平对齐方式，其值如下：,left,：左对齐（默认值）,center,：居中对齐,right,：右对齐,justify,：两边对齐,（,4,）对中标记,该标记中间的内容全部居中,（,5,）块标记,块标记的作用是定义文档块。常用属性如下：,align,：段落的水平对齐方式。其值如下：,left,：左对齐（默认值）,center,：居中对齐,right,：右对齐,（,7,）字体标记,字体标记用来设置文本的字符格式，主要包括字体、字号和颜色等。常用属性如下：,face,：字体名表,size,：字号值,color,：颜色值，设置字体的颜色,（,9,）超链接标记,超链接内容,超链接的常用属性如下：,href,：目标端点的,URL,地址（可以包含一个或多个参数）,超链接,单击此超链接，就会跳转到名为,b.html,的页面。该属性是必选项。,target,：窗口或框架的名称,target,属性的取值既可以是窗口或框架的名称，也可以是如下保留字：,_blank,：未命名的新浏览器窗口,_parent,：父框架页或窗口。如果包含链接的框架不是嵌套的，则链接的目标文件加载到整个浏览器窗口中,1.,表单及其控件标记,表单用来从用户（站点访问者）处收集信息，然后将这些信息提交给服务器进行处理,表单中可以包含允许用户进行交互的各种控件，例如，文本框、列表框、复选框和单选按钮等,用户在表单中输入或选择数据后提交，该数据就会提交到相应的表单处理程序，以各种不同的方式进行处理,表单结构如下：,（,1,）表单标记,该标记的格式如下：,form,标记的属性如下：,name,：表单的名称,method,：表单数据传输到服务器的方法。其属性值如下：,post,：在,HTTP,请求中嵌入表单数据,get,：将表单数据附加到请求该页的,URL,中,action,：接收表单数据的服务器端程序或动态网页的,URL,地址,target,：目标窗口。其属性值如下：,_blank,：在未命名的新窗口中打开目标文档,_parent,：在显示当前文档的窗口的父窗口中打开目标文档,_self,：在提交表单所使用的窗口中打开目标文档,_top,：在当前窗口内打开目标文档，确保目标文档占用整个窗口,form,标记有以下事件,onsubmit,：提交表单时调用的时间处理程序,onreset,：重置表单时调用的处理程序,下面具体介绍表单中的控件：,（,2,）表单输入控件标记,单行文本框,创建单行文本框方法如下：,（,a,）单行文本框的属性如下：,name,：单行文本框的名称，通过它可以在脚本中引用该控件,value,：文本框的值,default value,：文本框的初始值,size,：文本框的宽度（字符数）,maxlength,：允许在文本框内输入的最大字符数,form,：所属的表单（只读）,（,b,）单行文本框的方法如下：,click(),：单击该文本框,focus(),：得到焦点,blur(),：失去焦点,select(),：选择文本框的内容,（,c,）单行文本框的事件如下,onclick,：单击该文本框时执行的代码,onblur,：失去焦点时执行的代码,onchange,：内容变化时执行的代码,onfocus,：得到焦点时执行的代码,onselect,：选择内容时执行的代码,密码文本框,创建密码文本框方法如下：,密码文本框的属性、方法和事件与单行文本框的设置基本相同，只是密码文本框没有,onclick,事件,隐藏域,创建隐藏域方法如下：,隐藏域的属性、方法和事件与单行文本框的设置基本相同，只是没有,default value,属性,按钮,使用,input,标记可以在表单中添加,3,种类型的按钮：提交按钮、重置按钮和自定义按钮,创建按钮的方法如下：,（,a,）按钮的属性如下：,type,：按钮种类。具体如下,submit,：创建一个提交按钮,reset,：创建一个重置按钮,button,：创建一个自定义按钮,name,：按钮的名称,value,：显示在按钮上的标题文本,（,b,）按钮的事件如下,onclick,：单击按钮执行的脚本代码,2.,表格的使用,表格由表头、行和单元格组成，常用于组织和显示信息，还可以用于安排页面布局,表格的表头、行和单元格分别用不同的标记来定义,可以用,table,标记定义表格；表格中的每一行用,tr,标记来表示；行中的单元格用,td,或,th,标记定义,其中,th,标记定义表格的列标题单元格，表格的标题说明则用,caption,标记来定义。定义表格的格式如下：,第,1,列表头,第,2,列表头,第,n,列表头,第,1,行第,1,列值,第,1,行第,2,列值,第,1,行第,n,列值,.,第,n,行第,1,列值,第,n,行第,2,列值,第,n,行第,n,列值,（,1,）设置表格的属性,用,table,标记创建表格时，可以设置以下属性：,align,：表格的对齐方式。其属性值如下：,left,：左对齐（默认值）,center,：居中对齐,right,：右对齐,background,：表格背景图片的,URL,地址,bgcolor,:,：表格的背景颜色,border,：表格边框的宽度（像素），默认值为,0,bordercolor,：表格边框的颜色，,border,0,时起作用,bordercolordark,：三维边框的阴影颜色，,border,0,时起作用,bordercolorlight,：三维边框的高亮显示颜色，,border,0,时起作用,cellpandding,：单元格内数据与单元格边框之间的间距（像素）,width,：表格的宽度（像素或百分比）,（,2,）设置行的属性,表格中的每一行是用,tr,标记来定义的，可以设置下列属性：,align,：行中单元格的水平对齐方式。其属性值如下：,left,：左对齐（默认值）,center,：居中对齐,right,：右对齐,background,：行的背景图片的,URL,地址,bgcolor,：行的背景颜色,bordercolor,：行的边框颜色，只有当,table,标记的,border,0,时起作用,bordercolordark,：行的三维边框的阴影颜色，只有当,table,标记的,border,0,时起作用,bordercolorlight,：行的三维边框的高亮显示颜色，只有当,table,标记的,border,0,时起作用,valign,：行中单元格内容的垂直对齐方式。其属性值如下：,top,：顶端对齐,middle,：居中对齐,bottom,：底端对齐,baseline,：基线对齐,（,3,）设置单元格的属性,td,标记和,th,标记的属性如下,align,：行中单元格的水平对齐方式。其属性值如下：,left,：左对齐（默认值）,center,：居中对齐,right,：右对齐,background,：单元格的背景图片的,URL,地址,bgcolor,：单元格的背景颜色,bordercolor,：单元格的边框颜色，只有当,table,标记的,border,0,时起作用,bordercolordark,：单元格的三维边框的阴影颜色，只有当,table,标记的,border,0,时起作用,bordercolorlight,：单元格的三维边框的高亮显示颜色，只有当,table,标记的,border,0,时起作用,colspan,：合并单元格时一个单元格跨越的表格列数,rowspan,：合并单元格时一个单元格跨越的表格行数,valign,：单元格中文本的垂直对齐方式。其属性值如下：,top,：顶端对齐。,middle,：居中对齐,bottom,：底端对齐,baseline,：基线对齐,nowrap,：若指定该属性，则要避免,Web,浏览器将单元格里的文本换行,代码实现如下：,（,1,）,head.html,学生信息管理系统,（,2,）,left.html,学生成绩查询,学生信息显示,返回开始页面,什么是,JSP,？,JSP,是,Java Server Pages,的简称，其主要作用是简化建构与管理动态网页的过程，它不像,Servlet,一样全部内容都是,Java,程序代码，而且需要自己先行进行编译。在,JSP,文件中，可以夹杂,HTML,、,Java,程序代码与,JS,代码（虽然在执行,JSP,时，,Application Server,会自动将,JSP,文件转换为,Servlet,程序代码，然后加以编译成为可执行的,Servlet,）。,JSP,文件并不是每次都会被编译成,Servlet,程序，当用户调用,JSP,文件时，系统会自动检查此,JSP,程序是否被编译过，若已经编译过则直接执行,Servlet,程序，否则就会将,JSP,编译为,Servlet,后再执行，因为,JSP,文件只有在第一次执行时会被编译成,Servlet,，如果,JSP,文件无任何改动，那么就会直接执行,Servlet,，以减少在服务器端处理的时间，并提高执行效率。,JSP,网页与服务器、客户机之间的关系,经典的,Hello World,程序,meta http-equiv=Content-Type content=,texthtml,;,charset,=,gbk,The Current time is:,脚本语言与动态语言,脚本语言可在,jsp,的任何位置出现,例如：,alert();,动态语言（以,标识的部分）在服务器端执行，浏览器只执行静态,html,以及脚本的加载解释，动态语言之间可加载,html,例如：,hello world;,脚本语言与