Html与jsp基础知识.ppt
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任何文本编辑工具，如：记事本、EditPlusHTML的运行环境浏览器Internet Explorer 6FireFox1.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：表格边框的宽度（像素），默认值为0bordercolor：表格边框的颜色，border0时起作用bordercolordark：三维边框的阴影颜色，border0时起作用bordercolorlight：三维边框的高亮显示颜色，border0时起作用cellpandding：单元格内数据与单元格边框之间的间距（像素）width：表格的宽度（像素或百分比）,（2）设置行的属性表格中的每一行是用tr标记来定义的，可以设置下列属性：align：行中单元格的水平对齐方式。其属性值如下：left：左对齐（默认值）center：居中对齐right：右对齐background：行的背景图片的URL地址bgcolor：行的背景颜色bordercolor：行的边框颜色，只有当table标记的border0时起作用bordercolordark：行的三维边框的阴影颜色，只有当table标记的border0时起作用bordercolorlight：行的三维边框的高亮显示颜色，只有当table标记的border0时起作用valign：行中单元格内容的垂直对齐方式。其属性值如下：top：顶端对齐middle：居中对齐bottom：底端对齐baseline：基线对齐,（3）设置单元格的属性td标记和th标记的属性如下align：行中单元格的水平对齐方式。其属性值如下：left：左对齐（默认值）center：居中对齐right：右对齐background：单元格的背景图片的URL 地址bgcolor：单元格的背景颜色bordercolor：单元格的边框颜色，只有当table标记的border0时起作用bordercolordark：单元格的三维边框的阴影颜色，只有当table标记的border0时起作用bordercolorlight：单元格的三维边框的高亮显示颜色，只有当table标记的border0时起作用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;,脚本语言与动态语言,、表达式包含一个符合JSP语法的表达式JSP 语法例子现在是北京时间：,out 对象out 对象能把结果输出到网页上。它的常用方法如下：void print(String str)输出内容到网页例：测试out对象);%,JSP动态操作数据库,连接数据库 1、装载数据库驱动 2、获取数据库连接例如：,Jsp和html区别,1、html静态页面，浏览器解析（也就是说不需要打开服务器就能执行结果）2、jsp动态页面，Web容器解析（也就是说必须要打开服务器才能运行正确结果）3.他们的表头不同，这个是JSP的头“”在表头中有编码格式和倒入包等 4.在jsp中用就可以写Java代码了，而html没有 aspjspphp为动态的语言，是可以和服务器交互查询数据的。可以把HTML看作是界面，把aspjspphp等看作是后台代码。html是w3c规范的一种网页书写格式，是一种统一协议语言。我们上网看的网页都是大部分都是基于html语言的。jsp是一种基于动态语言，jsp在容器中会被解释为servlet，然后解析jsp中的动态内容，最终还是会返回给浏览器html格式的语言，在html中书写jsp的内容，容器(tomcat等)就会把jsp转换成servlet进行解析，返回html。,
