JavaWEB开发学习笔记.doc

WEB 1、html基础(1)什么是html?hypertext markup language,超文本标记语言。用于开发网页的语言，由浏览器解释执行。html文件以.html/.htm结尾。(2)html文件的基本结构标题(3)web开发标准w3c建议，开发一个页面，应该这样设计：页面的结构（包括了数据），由html文档来负责。页面的外观，由css文档来负责。页面的行为，由javascript文档来负责。(4)链接a,基本使用描述_blank:在新的窗口中打开url地址所对应的内容_self: 在当前窗口打开（默认）b,使用图片作为链接c,使用热点当shape=rect（矩形）时，coords的值为左上角和右下角的坐标值; 当shape=poly（多边形）时，为各顶点值; 当shape=circle（圆形）时，为圆心坐标值和半径值。 coords值依照图片大小的不同和所希望链接区域的不同而有所不同d,使用锚点:在同一个页面内部跳转e,发送邮件f,链接中的伪样式（css中再讲）(5)列表a,无序列表b,有序列表c,列表嵌套(6)表格a, 基本使用 align=idnamesalary1zs2000border:边框的宽度cellpadding:单元格里面的数据与单元格边框之间的距离cellspacing:单元格之间的距离width:60%/600 宽度align: 水平位置 left/center/rightvalign:垂直位置 top/middle/bottomb,不规则的表格cospan:跨列合并rowspan:跨行合并c,表格的另一种写法标题thead:表头，0/1tfoot:表脚,0/1tbody:表体,1/nd,表格可以嵌套(7)表单什么是表单：用于收集用户的信息，比如登录表单可以让用户输入登录的用户名、密码，这些信息会提交给服务器来验证。input标记:type=text: 文本输入框type=submit:提交按钮type=reset:重置按钮type=password:密码输入框type=radio:单选type=checkbox:多选type=file:上传文件(必须给form添加enctype=multipart/form-data)type=hidden:隐藏域非input标记:多行文本输入框:下拉列表/多选框(8)框架什么是框架，用来将一个窗口划分成多个子窗口。a,注意：frameset不能写在里,可以嵌套使用。b, 属性：width height可以使用在里，表示嵌入一个子窗口。(9)其它标记.:标题行内标记:不单独占一行的标记块级标记:另起一行的标记. 标题 表格 表单 段落 用于布局(10)实体在html页面中，出现了空格、,< " & (11) html/xhtml:xhtml:扩展的超文本标记语言。w3c按照xml语法要求重新定义了html中的标记与相应的属性。比如要求标签必须层层嵌套，属性必须用引起来，标签必须要结束。尽量使用小写。:error! : ok! :error! :ok!html/xhtml文档类型声明常见的文档类型声明XHTML 过渡型XHTML 严格型HTML严格型HTML松散型1、css(1)cascading style sheet 级联样式表，按照w3c的规范，页面的数据与结构由html来负责，页面的外观（展现给用户的界面）由css来负责。(2)css的基本语法选择器名称属性：属性值;属性2：属性值2;比如#d1font-size:50px;(3)施加样式（将样式施加到指定的html标签之上）通过选择器来施加。a,标签选择器bodyfont-size:50px;background-color:#cccccc;对具有相同标签名的所有标签起作用。b,class选择器.选择器的名称对标签class属性值和选择器名称相同的标签起作用。标签名.选择器的名称标签的class属性要与选择器名称相同，并且标签名要一致。c,id选择器#选择器的名称标签的id属性要与选择器的名称相同。d,选择器的分组div,h1,pfont-size:120px;表示对div,h1,p都施加该样式e,选择器的派生div pfont-size:150px;(4)样式的继承子标签会继承父标签的样式。(5)样式的优先级 浏览器默认样式 外部样式:使用link 引入外部的.css文件。 内部样式：使用style定义的样式 内联样式:使用标签的style属性定义的样式 从上往向优先级增大。(6)几个重要的属性 a,位置相关的属性 margin:外边距 margin-left: margin-right: margin-top: margin-bottom: 也可以简写为 margin: 顶，右，底，左 margin:0px; margin:20px auto; 左右居中，顶、底各20px; padding:内边距 padding-left: padding-right: padding-top: padding-bottom: 也可以简写为 padding: 顶，右，底，左 内边距在使用时，要注意，子标签会将标签撑开。 b,边框 border:宽度 样式 颜色; border-left:左边框 border-right: border-bottom: border-top: c,背景 background-color:#cccccc;背景颜色 background-image:url(图片的地址);背景图片 background-repeat:no-repeat/repeat-x/repeat-y; 平铺方式 background-attachment:fixed/scroll(默认); background-postion:100px 200px; background:背景 图片地址 平铺方式 依附方式 水平位置 垂直位置 d,文字 font-size:文字大小 font-weight:粗细 100-900 font-family:字体 text-decoration: none/underline下划线 cursor:pointer（小手）/wait（沙漏） 光标 text-align: left/right/center 对齐方式 e,列表 list-style-type:none;除掉小圆点 f,关键属性 float:浮动 left/right 其作用：取消块级标签的独占一行的特性，也就是将竖排列表横向化。 clear:取消浮动 both; line-height 行高(7)布局：清空body,ul,li,imgmargin:0px;padding:0px;font-size:12px;(8)链接的伪样式a:link color: red 没有访问时a:visited color: blue 访问后a:active color: lime 鼠标点击但还没有放开时a:hover color: aqua 鼠标指向时 display属性：block: html标记以块标记的形式来显示inline: html标记以行内标记的形式来显示none: 隐藏html标记position属性：static:(默认值)浏览器默认将html标记按从左到右，从上到下摆放。行标记从上到下，了标记从左到右absolute:相对父标记偏移relative:先按照默认方式摆放，然后再偏移1、javascript基础(1)javascript是什么，能做什么？是网景公司开发的一种用于与页面进行交互的脚本语言。javascript程序在浏览器端执行。javascript程序可以写在.js结尾的文件里。作用：a,前端验证（就是对用户提交的表单中的数据进行验证，比如验证用户名是否为空,如果验证通不过，则浏览器不会将数据提交给服务器）。b,ajax核心技术之一，用于异步向服务器发送请求并动态更新页面。c,与页面进行交互，生成动态的效果。d,获得浏览器相关的信息。(2)javascript的组成部分ECMAScript:语法基础（已经标准化了）DOM:文档对象模型（部分标准化了） BOM：浏览器对象模型（没有标准化，但是大部分浏览器都支持window,location,history,screen等对象）。2、语法基础(1)数据类型a,基本数据类型number:数字类型string:字符串boolean: true/false 布尔类型null:变量没有存放任何对象的地址undefined:未定义 alert(a);b,引用类型变量Object:对象Array:数组Date:日期函数Math:数学计算(2)变量javascript是一种弱类型语言，变量的类型在运行时确认，并且可以随时转换。javascript大小写敏感。标识符不能使用关键字和保留字标识符首字母只能是 A$_开头，首字母以外，可以包含数字。 var f = 1ab error! var f = ab3; ok! var s = _ab ok!变量的作用域：在函数内部，不使用var声明的变量是一个全局变量。没有语句块作用域(3)数组a,特点：js中的数组长度可变，存放的数据类型可以是任意的。b,数组的创建：var arr = new Array();arr0 = 1;arr3 = 2;alert(arr.length);var arr = 1,2;c,数组对象的常用方法和属性length属性返回数组的长度toString()方法, 返回数组的字符串表示concat方法, 用于连接两个数组join()方法，用于将数组中的各个元素连接成字符串。reverse()方法，将数组反转slice()用于截取数组的一部分并以数组的形式返回 /sort()按照字典顺序排序 不区分数字还是字母 按照字母顺序排序sort()排序，可通过如下形式来重新定义排序方式：var arr4 = arr3.sort(function(a1,a2)return -a1.length + a2.length;);d,数组可以当作堆栈和队列来使用push();pop();shift();出对列(4)字符串的常用方法和属性length属性 返回字符串的长度charAt(index) 返回指定位置的字符substring(from, to) 返回子字符串indexOf(str) 指定字符串在原字符串中第一次出现的位置lastIndexOf(str) 指定字符串在原字符串中最后一次出现的的位置match(regexp) 返回匹配指定正则表达式的字符串,返回的结果是一个数组:var str2 = asd212abc345;var reg2 = /0-9+/g; global 搜索全局var arr = str2.match(reg2);search(regexp) 返回按照正则表达式检索到的字符串位置str2.search(reg2)toLowerCase/toUpperCase 返回小写/大写形式replace(regexp,abc); 替换符合reg正则表达式规定的字符串str2 = str2.replace(reg2,888);split(,):分解,返回的是一个数组3、DOM(Document Object Model)(1)什么是dom?w3c定义了一套规则，由于将结构化的文档（XML/HTML)转化为一棵树，目的是为了便于对结构化的文档进行增删改查操作。(2)由于历史原因,dom没有完全标准化html dom模型：最早的dom模型(早于w3c的dom模型）w3c dom模型：主流,各大浏览器基本都支持编程时，都可以使用。(3)w3c dom模型a,继承关系图(了解)Node DocumentHTMLDocumentHTMLBodyElement /body对应的对象ElementHTMLElementHTMLFormElementHTMLInputElementHTMLSelectElementHTMLOptionElementHTMLDivElementHTMLTableElementHTMLTableCaptionElementHTMLTableRowElementHTMLTableCellElementb,操作查找：方式一，使用iddocument.getElementById(id);方式二，遍历（浏览器不兼容）parentNode previousSibling nextSibling childNodes firstChild lastChildgetElementsByTagName(tagName)创建document.createElement(Tag)添加appendChildinsertBeforereplaceChild删除removeChild样式操作：方式一，通过设置className属性(4)浏览器对某些html标记产生的事件，有默认的行为。比如点击链接，会跳转到href指向的地址。表单，当点击提交按钮，会将表单中的数据提交给服务器。有些时候，需要禁止默认行为。test练习：表单中包含如下内容，要求作验证：username:非空password:非空repassword: 两次填写必须一致phone: 类似dcard:15位或者18数字,如果是18位，最后一位可以是X/xemail: 必须包含正则表达式的使用：var reg = /d8$/;var str = 123;reg.test(str);双色球:六个红球: 从1-33中取，不能重复。一个蓝球：从1-16中取。要求按从小到大输出。随机数产生的方式：Math.random(); 0-1之间的一随机数Math.floor(); 取整数 2.88-2Math.ceil(); 取大的整数 2.88-31、BOM(1)什么是BOMBrowser Object Model。获得窗口及浏览器信息。(2)主要的BOM对象a, windowopen方法打开一个新的窗口，例如：window.open(1.html, new, height=100, width=200, top=0, left=0,toolbar=no, menubar=no,scrollbars=no, resizable=no, location=no, status=no)；1.html 弹出窗口的文件名；new 弹出窗口的名字；如果该参数指定了一个已经存在的窗口，则 open() 方法不再创建一个新窗口，而只是返回对指定窗口的句柄。height=100 窗口高度；width=200 窗口宽度；top=0 窗口距离屏幕上方的象素值；left=0 窗口距离屏幕左侧的象素值；toolbar=no 是否显示工具栏，yes为显示；menubar 是否显示菜单栏。scrollbars 是否显示滚动栏。resizable=no 是否允许改变窗口大小，yes为是 。location=no 是否显示地址栏，yes为是。status=no 是否显示状态栏内的信息。close方法关闭窗口返回值为窗口对象句柄document属性获得Document对象location属性获得Location对象alert方法弹出一个警告对话框confirm方法弹出一个选择对话框，返回用户是否确认。用户确认，返回值是mpt方法弹出一个供用户输入信息的对话框，返回用户输入信息。setTimeout方法setTimeout(f,1000) 方法用于在指定的毫秒数后调用函数或计算表达式。clearTimeout方法clearTimeout() 方法可取消由 setTimeout() 方法设置的 timeout。setInterval方法var taskId = setInterval(f,1000)按照指定的周期（以毫秒计）来调用函数或计算表达式。setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。clearInterval方法clearInterval(taskId) 方法可取消由 setInterval() 设置的 timeout。clearInterval() 方法的参数必须是由 setInterval() 返回的 IDopener属性打开当前窗口的窗口parent属性当前窗口的父窗口b, navigator描述浏览器本身的信息，比如浏览器的类型等等。c, location描述浏览器地址相关的信息。d, documentgetElementById();write():直接在页面上输出。2、事件处理机制(1)如何绑订事件处理代码a,绑订事件处理代码到html标记之上。b,绑订事件处理代码到dom节点之上。var obj = document.getElementById(a1)obj.onclick=f1;/绑定事件处理代码到 obj缺点：不方便传参优势：将js代码与html代码分离，便于代码的维护。 window.onload=function 在javascript编程当中，函数总是因为事件触发而被调用。事件产生的情况有两件：一种是外部操作引起的，比如用户点击某个按钮。一种是浏览器自身产生的，比如浏览器加载整个html文档完毕之后，会产生load事件。当事件产生以后，会执行绑订到它上面的相应的处理函数。c,使用浏览器特定的绑订方式。尽量不使用，因为浏览器兼容性问题。(2)如何获得事件对象IE: 直接使用eventwindow.eventFF: 需要通过传参的方式f1(event);(3)如何获得事件源IE: event.srcElementFF: event.target(4)事件冒泡机制a,什么是事件冒泡子节点产生的事件会向上传递给父节点（默认情况下）b,取消冒泡event.cancelBubble = true;(5)常见的事件类型clickdblclickblurfocusloadmouseovermouseoutchange3、函数与对象(1)函数a,实参的个数可以与形参的个数不一致b,可以通过arguments对象获得参数值。(2)js中没有类的定义方式，使用函数的语法格式来创建一个类。(3)创建对象的方式 方式一：new Function() 方式二： step1 var obj = new Object(); step2 可以动态地为一个对象增加新的属性和方法。 方式三：(json语法,讲jQuery框架时说)(4) prototype属性可以为一个类型增加新的属性和方法(5)内置对象 Math:用于数学计算 Date:日期4、prototype框架 $(id):相当于document.getElementById(id); $F(id):document.getElementById(id).value; $(id1,id2.);返回一个数组，数组元素是通过 document.getElementById(id)获得。 strip():除掉空格练习：1、进度条2、动态显示当前系统时间：小时，分钟，秒。1、什么是servlet? 能做什么？sun公司制订的一种用于扩展web服务器功能的组件规范。扩展：web服务器本身没有计算能力，也就是说，不能处理动态资源的请求。servlet可以处理动态资源的请求。组件：组件是符合规范，完成一定功能，并可以单独部署的软件模块。组件一般不能独立运行，需要依赖容器才能运行。容器：是一种程序，提供组件的运行环境，并且管理组件的生命周期。servlet容器： 提供servlet运行的环境，并且管理servlet的 生命周期。一般常见的web服务器，比如tomcat, 除了是一个servlet容器以外，同时，也是一个web服务器。能做什么？servlet只能够采用java语言来开发，servlet可以做java类能做的所有的事件。2、如何开发一个servlet?step1 写一个java类，实现Servlet接口或者继承HttpServlet类。step2 编译 (依赖servlet api)step3 打包(定义一个特定的目录结构，将相应的字节码，配置文件，相关的jar文件放到对应的目录结构里)appname(名称任意，一般称为应用名)WEB-INFclasses(放.class文件)lib(可选，放.jar文件)web.xml(部署描述文件)html/jspstep4 部署(将step3中的结果放到服务器特定的目录,对于tomcat,是webapps)step5 启动服务器startup.batstartup.sh启动成功：http:/localhost:8080关闭服务器shutdown.batshutdown.shstep6 访问servlethttp:/localhost:8080/appname/url-pattern3、servlet是如何运行的？假如在浏览器地址栏输入了如下地址：http:/ip:port/helloworld/hello1)浏览器依据ip,port连接服务器。2)浏览器将请求数据按http协议打成一个http请求数据包（包含了helloworld/hello）3)服务器当中的一个负责通讯的模块（一般称为servlet引擎）会创建HttpServletRequest的一个实例(HttpServletRequest实际上是一个接口，由服务器提供者来实现)，该实例包含了请求数据包中的数据。另外，还创建了一个HttpServletResponse的一个实例。4)服务器依据helloworld/hello找到web.xml，依据web.xml中的信息找到对应的Servlet类名。会查看该Servlet有没有对应的实例，如果没有，则创建实例，有的话，就不创建，使用现成的实例。接下来，调用service()方法。service方法里面的代码可以通过HttpServletRequest提供的方法来获得请求中的数据，并且，也可以将处理之后的结果通过HttpServletResponse提供的方法设置返回的结果。5)Servlet引擎从HttpServletResponse获取数据，生成http响应数据包，发送给浏览4、使用myeclipse开发servlet1)安装myeclipse2)开发步骤step1 建立一个web工程step2 在src下面编写java类step3 在web.xml中配置servletstep4 部署a,让myeclipse管理tomcatb,部署step5 访问http:/ip:port/appname/url-pattern练习：写一个DateServlet，用户可以通过输入 http:/ip:port/web01_exec/date，输出当前服务器时间。课后练习：ListEmpServlet,查询t_emp表中的数据，以表格的形式显示所有记录。1、http协议（1）是什么？hypertext tansfer protocol 超文本传输控制协议。(w3c定义)。定义了浏览器与web服务器之间数据传输的方式与数据格式。（2）数据传输的方式a, 浏览器请求建立连接。b, 浏览器向服务器发送请求。c, 服务器处理请求d, 服务器发送响应，然后立即关闭连接。如果浏览器想向服务器再发送一个请求，需要重新请求建立连接。（3）数据格式a,请求数据包1)请求行请求方式(get/post) 请求资源的路径 http协议版本(1.0/1.1)2)若干消息头浏览器与服务器之间通讯的一些约定。比如，浏览器可以告诉服务器，浏览器是什么，版本是什么。3)实体内容如果是post方式，请求数据会存放到实体内容里面。如果是get方式，会放到请求行中的请求资源路径之后。b,响应数据包1)状态行协议版本号 状态码 状态码的描述状态码:200 正常404 找不到资源500 系统内部错误2)若干消息头比如服务器可以向浏览器发送cookie。3)实体内容服务器处理完之后的结果，一般要求浏览器显示的数据。2、get/post请求方式(1)get方式：a,表单默认提交的方式b,直接在浏览器地址栏输入地址c,通过链接访问某个地址(2)get方式的特点：在地址栏会显示请求数据。请求数据会放到请求资源路径后面。get方式一般用于向服务器获取资源。浏览器有可能缓存get方式访问过的数据。(3)post方式：设置表单method=post。(4)post方式的特点:a,数据不会在地址栏显示。b,数据会存放到实体内容里。c,post方式一般用于向服务器提交数据。(5)优缺点比较get方式提交数据有两个缺点：a,提交的数据量有限制（因为只能存放到请求行之后）b,不安全（在浏览器地址栏能看到数据）post方式提交数据有优点：a,数据量大（因为存放在实体内容里面）b,相对安全（但是实体内容里面的数据仍然没有加密，可以借助工具看到）3、重定向1）什么是重定向：服务器向浏览器发送一个状态码302及一个消息头location，浏览器会立即向location所指定的地址发送一个新的请求。2）编程response.sendRedirect(重定向的地址);3）重定向的特点及需要注意的问题a,重定向的地址是任意的。b,浏览器地址栏的地址会变成重定向的地址。c,一件事情已经做完。要注意的问题：在重定向之前，不能够有任何的输出。如果缓存当中有数据，重定向之前，会先清空缓存中的数据。4、服务器如何处理url地址比如在浏览器地址栏输入：http:/ip:port/appname/abc.html浏览器会依据ip,port连接服务器，然后，会将/appname/abc.html会存放到请求数据包的请求行。 服务器如何处理/appname/abc.html?step1 服务器会查看有没有appname对应的应用存在，若没有，则返回404。若有，则进行下一步。step2 在web.xml中，使用/abc.html与url-pattern进行匹配：a,精确匹配: 要求完全匹配。b,模糊匹配(使用通配符*)*代表任意的字符串。比如:/some/*/some ok!/some/adsfad ok!c,后缀匹配不能以/开头比如:*.do 表示以.do结尾的请求abc.do ok!abc error! step3 如果仍然不匹配，会查询静态资源。如果能够找到该资源，则返回，找不能，返回4045、servlet的生命周期与核心的类与接口(1)核心类与接口 Servlet接口 a,所有的Servlet，必须实现该接口。 b,该接口定义了三个方法: init(ServletConfig config):初始化方法 service(ServletRequest request, ServletResponse response):处理请求 destroy():销毁资源. GenericServlet抽象类,部分实现了Servlet接口。 实现了init,destroy方法。 HttpServlet抽象类，继承GenericServlet, 实现了service()方法。 service(HttpServletRequest request, HttpServletResponse response)。 HttpServletRequest是ServletRequest子接口。 HttpServletResponse是ServletResponse的子接口。(2)生命周期：什么是生命周期：Servlet容器如何去创建Servlet实例，分配资源，调用其方法，最后销毁的整个过程。分四个阶段：a,实例化:调用缺省的构造器，创建对象。创建对象的时机：1)当请求到达Servlet容器时，如果要访问的servlet没有对应的实例，则会创建。2)当服务器启动时，会检查web.xml中的配置如果1“1”表示优先级，值越小，优先级越高。b,初始化:分配资源 Servlet容器创建Servlet实例之后，一定会执行init()方法。该方法只会执行一次。默认的init()由GenericServlet来实现。如果想定义自己的初始化过程，可以override init()方法。方式一： override init(ServletConfig config);方式二： override init() 最好使用方式二。c,就绪，执行service()方法。HttpServlet的service()方法，会依据get/post请求，分别调用对应的doGet(HttpServletRequest request,HttpServletResponse response)doPost(HttpServletRequest request,HttpServletResponse response)方法。我们开发的servlet，可以override service():或者override doGet(),doPost():d,销毁：容器依据自己的算法，会删除Servlet实例，在删除之前，会调用destroy()方法，释放资源。该方法也只会执行一次。练习：(1)计价算法：最终价格(price) = 产品的基本价格(basePrice)*( 1 + taxRate)。提供一个界面：输入产品的销售地点:输入产品的基本价格:PricingServlet:依据销售地点，查询taxRate,然后计算之后，将结果显示在页面上。public class GenericServletprivate ServletConfig config/Servlte容器在调用init方法时，会/将一个ServletConfig实例传递过来。/ ServletConfig对象主要用于获取/servlet的配置参数。public void init(ServletConfig config)/保存ServletConfig对象的引用。this.config = config;init();/空方法！“钩子方法，由子类来实现”public void init()servletConfig接口：容器在调用init()方法时，会事先创建好该对象，以参数的形式传递给servlet对象。该接口定义了获取servlet配置参数的方法String getInitParameter(String name)1、表单处理(1)获取表单中的数据要注意，参数名不存在，返回null String getParameter(String paraName); 如果有多个参数名相同，则使用下面的方法： String getParam