HTML
规范:
①<html>
————html标签,整个页面的开始
②<head>
————头标签(title标题,css样式,js代码)
<title>
标题</title>
————标题
②</head>
③<body>
————内容标签
主体内容
③</body>
①</html>
————整个页面的结束
<html lang="zh_CN">
:表示页面显示中文- ②内:
<meta charset="UTF-8">
:当前页面的字符编码格式
标签特性
-
标签大小写不敏感
-
标签拥有两种属性
①基本属性:如
bgcolor="name"
:设置页面颜色②事件属性:如
onclick="alect('内容')"
:单击显示alect警告框函数内的信息 -
标签两种分类
①单标签:如
<br/>
:换行、<hr/>
:水平线②双标签:如
<button>
文本</button>
:按钮、<b>
文本</b>
:加粗
标签语法
- 标签之间不能交叉嵌套
- 标签必须正确关闭
- 标签属性必须有值,值用
" "
括起来 - 注释不能嵌套
常用标签
字体标签
<font>
文本</font>
-
属性:
color
:颜色face
:字体size
:大小 -
大小范围为1~7,超出的话以7显示
特殊字符
-
<
:<
-
>
:>
-
标题
<h1>
文本</h1>
-
属性:
align
:标题的对其方式left
:左对齐,默认right
:右对齐center
:居中
-
h1表示标题大小为1(最大),其范围为1~6,超出的话以文本显示
超链接
<a>
文本</a>
-
属性:
href
:表示链接的地址(http://localhost:8080/工程名/
可省略)target
:打开链接的方式_self
:当前页面打开,默认_blank
:新页面打开name
:根据窗口的名字,用窗口打开
列表标签
<ul>
<li>
文本1</li>
<li>
文本2</li>
</ul>
-
属性:
type
:修改列表项前面的符号none
:无符号
-
ul是无序列表,ol是有序列表,li是列表项
图片
<img/>
-
属性:
src
:图片的路径-
相对路径:相对路径是根据当前页面地址栏中的地址来跳转的
.
:当前文件所在目录..
:当前文件的上一级目录文件名
:当前文件所在目录下的文件,相当于./
-
绝对路径:
http://ip:port/文件目录/文件名
width
:图片的宽度height
:图片的高度border
:图片的边框大小alt
:找不到图片的文本提示 -
表格
<table>
<tr>
<td>
文本</td>
</tr>
</table>
-
属性:
①table属性
align
:表格相对于页面的对其方式
border
:表格的边框
width
:表格的宽度
height
:表格的高度
cellspacing
:单元格与单元格间的间距②td属性
align
:内容相当于单元格的对其方式
clospan
:跨列数
rowspan
:跨行数 -
th
相当于<td align="center"><b>文本</b></td>
,即文本加粗且居中 -
tr
是行,td
是单元格
窗口
<iframe></iframe>
-
属性:
src
:图片路径width
:窗口宽度height
:窗口高度name
:窗口名称
表单
<form>
<input/>
<select>
<option>
文本</option>
</select>
<textarea>
默认值</textarea>
</form>
-
属性:
①form属性
action
:表单数据提交的地址
method
:表单数据提交的方式-
get
(默认):- 地址格式:action属性值+?+请求参数
- 请求参数格式:name=value&…
不安全,有数据长度限制
表单提交的form连接中,get不能带参数,只能使用隐藏域
-
post
:- 地址格式:action属性值
较安全,无长度限制
enctype
:POST请求时,请求体的编码方式application/x-www-form-urlencoded
(默认):- 表示用
&
分隔参数,用=
分隔键值对,字符要用URL编码方式进行编码
- 表示用
multipart/form-data
- 文件上传必须使用的编码方式
②input属性
type
:类型
value
:初始值、修改值、提交数据
name
:分类、提交数据
checked="checked"
:默认值text
:文本输入框,可用value设置初始内容password
:密码输入框,可用value设置初始内容radio
:单选框,可用name将多个单选框分为一类,可用checked选定某一组分类下的单选框为默认值,提交数据时需要额外用value来传值checkbox
:复选框,可用checked选定一个或多个复选框为默认值,被选中的复选框的值为true
,提交数据时需要额外用value来传值reset
:重置按钮,可用value修改按钮名称submit
:提交按钮,可用value修改按钮名称button
:按钮,可用value修改按钮名称file
:文件上传hidden
:隐藏域
③select属性
name
:用于提交数据
multiple="multiple"
:可多选④option属性
selected="selected"
:设置下拉列表框的某个选项为默认值
value
:用于提交数据⑤textarea属性
rows
:多行文本输入框的行数
cols
:多行文本输入框每行显示的字符数量
name
:用于提交数据 -
-
form
是向服务器提交数据,input type
设置各种表单类型,select
设置下拉框,textarea
设置多行文本输入框 -
表单提交时,数据发送给服务器的三个要求:
- 表单内需要提交的数据,要拥有name属性
- 单选框、复选框、下拉框中的option属性,需要额外添加value属性
- 表单要在form内
其他
<div>
文本</div>
:文本独占一行
<span>
文本</span>
:所占长度与文本长度相等
<p>
文本</p>
:在上方或下方空出一行,空行则不操作
<button>
文本</button>
:设置一个按钮,在表单提交中在不指明其属性type
的值时,默认为submit
onclick="函数"
:可用此来绑定单击事件
CSS
标签名选择器
选择器调用的方式:
1)在标签内使用style
属性:
<标签名 style="样式1;样式2...">
文本</标签名>
- 只对该标签有用
2)在<head>
中使用style type="text/css"
:
<style type="text/css">
选择器{
样式1;样式2...
}</style>
- 对当前页面有效
3)引用.css
文件:
<link type="text/css" rel="stylesheet" href="文件名.css"/>
- 只对调用了该文件的页面有效
- 修改的样式由文件内容中的选择器定义样式决定
标签选择器
<style type="text/css">
标签名{
}</style>
- 对当前页面所有的标签有效
id选择器
<style type="text/css">
#idxxx{
}</style>
- xxx为id编号
- 调用的标签通过
id="idxxx"
即可调用该样式
class选择器
<style type="text/css">
.classxxx{
}</style>
- xxx是class编号
- 调用的标签通过
class="classxxx"
即可调用
组合选择器
<style type="text/css">
选择器1,选择器2,...{
}</style>
- 标签可以通过任意一个选择器调用该代码
常用样式
- 各样式间用
,
隔开,样式有多个值的用
color
:设置字体颜色
border
:设置边框像素、颜色、线条(solid)
border-collapse:collapse
:表格边框合并
width
:设置边框宽度(px)
height
:设置边框高度(px)
background-color
:设置背景颜色
font-size
:设置字体大小(px)
margin-left:auto
、margin-right:auto
:设置整体页面居中
text-align
:设置字体位置
text-decoration
:去超链接下划线(none)
list-style
:设置列表符号为空(none)
display
:设置显示(none)
left
:x轴
top
:y轴
样式操作
addClass()
:添加样式
removeClass()
:删除样式,且会删除对应的class属性值
toggleClass()
:有就删除,没有就添加样式
offset()
:获取或设置元素坐标
JavaScript
1)
<script type="text/javascript">
内容;
</script>
2)调用文件
<script type="text/javascript" src="文件名.js"></script>
- 两种方法不能在同一个定义中同时调用
语法
变量
1)类型:
①数值类型:number
②字符串类型:string
③对象类型:object
④布尔类型:boolean
⑤函数类型:function
2)值:
①undefined
:未定义,所有未赋初始值的变量,默认都是undefined
②null
:空值
③NAN
:非数字,非数值(有undefined参与运算的值为NAN)
3)定义变量格式:
①var 变量名
②var 变量名=值
运算符
1)关系运算:
①==
:比较两者的字面值
②===
:比较两者的字面值以及两者的数据类型
2)逻辑运算:
0
、null
、undefined
、""
(空串)为false
,其他都为true
&&
与||
都有短路效果
①&&
且:
- 当表达式全为真时,返回最后一个表达式的值
- 当表达式中有一个为假时,后面的表达式不再执行,返回为假的表达式的值
②||
或:
- 当表达式全为假时,返回最后一个表达式的值
- 当表达式中有一个为真时,后面的表达式不再执行,返回为真的表达式的值
数组
①var 变量名=[]
:空数组
②var 变量名=[值1,值2,...]
:定义时赋值
- 通过数组下标给数组元素赋值时,最大的下标就是数组的长度(下标从0开始),数组的长度与读取时的最大下标无关,超出时为
undefined
- 未被赋值的数组元素值为
undefined
函数
- 函数不允许重载
- 当调用的函数与声明的函数参数列表不一致时,会调用隐形函数,参数列表为
arguments
的数组,数组长度与最大赋值下标有关
1)
①无参:
function 函数名(){ 函数体 }
②有参:
function 函数名(num1,num2,...){ 函数体 }
③有返回值:
function 函数名(){ return 返回值 }
2)
①无参:
var 函数名=function(){ 函数体 }
②有参:
var 函数名=function(num1,num2,...){ 函数体 }
③有返回值:
var 函数名=function(){ return 返回值 }
对象
1)
①定义:
var 变量名=new Object()
:空对象(对象实例)
变量名.属性名=值
:定义属性
变量名.函数名=function(){}
:定义函数
②调用:
变量名.属性名
、变量名.函数名()
2)
①定义:
var 变量名={
属性名:值,
函数名:function(){}
}
②调用:
变量名.属性名
、变量名.函数名()
事件
静态绑定:在作用的标签内作为属性出现
动态绑定:
①window.onload=function(){
②var 对象名=document.getElementById("id属性值");
③对象名.事件名=function(){}
}
①保证代码在页面加载完成后才会执行
②通过id属性获取标签的对象,document为当前这个页面信息的对象
③通过标签的对象名.事件名=function(){}注册事件
1)onload
:加载完成事件,浏览器解析完页面后就会自动触发的事件
2)onclick
:单击事件,常用于按钮点击后做出响应
3)onblur
:失去焦点事件,常用于输入框失去焦点后进行校验
4)onchange
:内容发生改变事件,常用于下拉列表或输入框发生改变时
5)onsubmit
:表单提交事件,常用于提交表单前验证其合法性
- 当返回
return false
时,则取消提交 return 方法名()
正则表达式
正则表达式两种创建方式:
①var 变量名=new RegExp("规则")
②var 变量名=/规则/
/x/
:字符串中是否包含字符x
/[xyz]/
:字符串中是否包含字符x或字符y或字符z
/[a-z]/
:字符串中是否包含任意小写字母
/[A-Z]/
:字符串中是否包含任意大写字母
/[0-9]/
:字符串中是否包含任意数字
/\w/
:字符串中是否包含任意字母、数字或下划线
/x+/
:字符串中是否包含至少1个字符x
/x*/
:字符串中是否包含0个或多个字符x
/x?/
:字符串中是否包含0个或1个字符x
/x{m}/
:字符串中是否包含连续m个字符x
/x{m,n}/
:字符串中是否包含至少m个、至多n个的连续的字符x
/x{m,}/
:字符串中是否包含至少m个连续的字符x
/x$/
:字符串是否以字符x结尾
/^x/
:字符串是否以字符x开头
DOM
获取节点的方式
document.getElementById("id属性值")
:返回当前页面中指定id的标签的对象
document.getElementsByName("name属性值")
:返回当前页面中所有指定name的标签的对象集合,该集合操作方式与数组相似
document.getElementsByTagName("标签名")
:返回当前页面中所有指定的标签的对象集合,该集合操作方式与数组相似
document.createElement("标签名")
:根据标签名创建了一个节点,并返回标签名节点的对象
document.createTextNode("文本")
:根据文本创建并返回一个文本节点对象
document.body
:获取body节点对象
window.onload=function(){}
该代码在页面加载完成时才执行
方法
getElementsByTagName("标签名")
:获取当前节点的指定标签的子节点
appendChild(子节点名)
:为当前节点添加一个子节点
attr
:获取对象的属性值
1)增删改
①内部增:
x.appendTo(y)
:将x元素添加成为所有y的子元素中的最后一个元素
x.prependTo(y)
:将x元素添加称为所有y的子元素中的第一个元素
②外部增:
x.insertAfter(y)
:将x元素添加到所有y元素的后面
x.insertBefore(y)
:将x元素添加到所有y元素的前面
③替换:
x.replaceWith(y)
:用y将所有的x替换掉
x.replaceAll(y)
:用x将所有的y替换掉,两者都要存在
④删除:
a.remove()
:删除a标签
a.empty()
:清空a标签的内容
属性
childNodes
:获取当前节点的所有子节点
firstChild
:获取当前节点的第一个子节点
lastChild
:获取当前节点的最后一个子节点
parentNode
:获取当前节点的父节点
nextSibling
:获取当前节点的下一个节点
previousSibling
:获取当前节点的上一个节点
className
:获取或设置当前节点的标签的class属性值
innerHTML
:查看或修改当前节点的标签的起始标签和结束标签间的内容
innerText
:查看或修改当前节点的标签的起始标签和结束标签间的文本内容
defaultValue
:默认的value值
其他对象
location
:地址栏对象(常用来调用Servlet程序)
href
:可获取浏览器地址栏中的地址,该属性可读可写
jQuery
- 使用前必须导入js文件
- 或者直接调用官方链接:
https://code.jquery.com/jquery-1.7.2.js
$( )
1)传入参数为函数时,会在页面加载完成之后才执行函数
2)传入参数为标签字符串时,会自动创建返回一个该标签的jQuery对象
- 每个标签间要用
""
隔开表示,并用+
连接为一个完整的标签
3)传入参数为选择器字符串时,查询并返回选择器属性值所对应的标签的对象或对象集合
4)传入为dom对象时,会将dom对象转换为jQuery对象并返回
- 若要取出jQuery数组中的dom对象,只需要通过根据对应的下标即可取出
选择器
基本选择器
$("#id属性值")
:查询指定id属性值的标签
$(".class属性值")
:查询指定class属性值的标签
$("标签名")
:查询指定标签名的标签
$("*")
:查询所有的标签
$("选择器1,选择器2")
:获查询含有选择器1或选择器2的标签
层级选择器
$("x y")
:查询父标签x内的所有的后代标签y
$("x>y")
:查询父标签x内的所有的子代标签y
$("m+n")
:查询m标签后面的一个n标签
$("m~n")
:查询与m标签同级的所有n标签
基本过滤选择器
:first
:查询第一个标签
:last
:查询最后一个标签
:not(标签名)
:查询非该标签的标签
:even
:查询索引为偶数的标签,索引从0开始
:odd
:查询索引为奇数的标签,索引从0开始
:eq(索引)
:查询指定索引的标签
:gt(索引)
:查询大于该索引的标签
:lt(索引)
:查询小于该索引的标签
:header
:查询标题标签
:animated
:查询正在执行动画的标签
内容过滤选择器
:contains("文本")
:查询包含指定文本的标签
:empty
:查询不包含子元素或文本的空标签
:parent
:查询包含子元素或文本的标签
:has(标签x)
:查询含有标签x的标签
属性过滤选择器
[属性名]
:查询包含指定属性的标签
[属性名=值]
:查询包含指定属性名和属性值的标签
[属性名!=值]
:查询不含指定属性或指定属性的值不等于特定的值的标签
[属性值^=值]
:查询包含指定属性的以指定属性值开头的标签
[属性值$=值]
:查询包含指定属性的以指定属性值结尾的标签
[属性值*=值]
:查询包含指定属性的包含指定属性值的标签
[...][...]...
:同时满足多个过滤器的标签
表单过滤选择器
:text
:查找所有的文本输入框
:password
:查找所有的密码输入框
:radio
:查找所有的单选框
:checkbox
:查找所有的复选框
:submit
:查找所有的提交按钮
:reset
:查询所有的重置按钮
:button
:查询所有的按钮
:hidden
:查找所有的隐藏元素(type为hidden或display为none)
表单属性过滤选择器
:enabled
:查询可选的元素
:disabled
:查询不可选的元素
:checked
:查询选中的元素(单选框、多选框等,不包含下拉框)
:selected
:查询option中选中的元素
方法
- 在
function(){}
函数中,有一个this
对象,该this对象是正在响应的事件的dom对象
eq(索引)
:获取指定索引的元素
first()
:获取第一个元素
last()
:获取最后一个元素
filter(值)
:获取与值匹配的元素
is(值)
:只有要一个值与其匹配,返回true
has(值)
:获取含有该值的元素
not(值)
:获取非该值的元素
children(值)
:获取指定值的子元素
find(值)
:获取指定值的后代元素
next()
:获取当前元素的下一个元素
nextAll()
:获取当前元素后的所有元素
nextUntil(值)
:获取从当前位置到指定值间的所有元素
parent()
:获取父元素
prev()
:获取当前元素的上一个元素
prevAll()
:获取当前元素前面所有的元素,按逆序存入数组
prevUntil(值)
:获取当前元素至指定值间的所有元素
siblings()
:获取当前元素前后的所有元素
add(值)
:将指定值添加进当前元素中
trim()
:去除首尾空格
confirm()
:确认提示框函数,参数为提示内容,返回值为boolean类型。
- 有两个按钮,“确定”按钮返回值为true,“取消”按钮返回false
属性操作
html()
:设置和获取起始标签和结束标签中的内容
text()
:设置和获取起始标签和结束标签中的文本内容
val()
:设置和获取表单项的value属性值
val(["值1","值2",...])
:根据标签的value可批量默认选择单选框、多选框等
attr("属性名","值")
:2个参数时,设置指定属性的值,1个参数时,获取属性值
- 对于
checked
、readOnly
、selected
、disabled
,推荐使用prop()
- 能自定义属性和属性值
动画操作
- 参数1:动画执行时长,以毫秒为单位
- 参数2:拥有回调函数(动画执行完自动调用的函数)
1)基本动画:
show()
:将隐藏的元素显示
hide()
:将可见的元素隐藏
toggle()
:可见就隐藏,不可见就显示
2)淡入淡出动画:
fadeln()
:淡入
fadeOut()
:淡出
fadeToggle()
:淡入淡出间切换
fadeTo(t,x)
:指定时长t内,修改透明度至x,0为透明,1为完全显示
事件
- 在绑定事件的
function(){}
中,若使用参数event,此刻的event即为事件的对象,可由此获取到事件的类型type
、x坐标pageX
、y坐标pageY
click()
:单击事件,可绑定事件,也可触发事件
mouseover()
:鼠标移入对象时触发事件
mouseout()
:鼠标移出对象时触发事件
mousemove
:鼠标在对象内移动时触发事件
bind("事件1 事件2 ...",function(){})
:可以给一个元素同时绑定多个事件
unbind()
:效果与bind相反,解除事件的绑定,不传参时解除所有绑定事件
one()
:效果与bind类似,但所有事件只会响应一次
live()
:效果与bind类似,但用live绑定的一个或多个事件,由同样选择器创建的新的元素,也会具有绑定效果
change()
:内容发生修改时触发事件
blur()
:失去焦点时触发事件
XML
元素(标签):
- 名称可以包含字母、数字、其他字符,不能以数字、标点符号、xml开始,不能包含空格
- 也分为单标签和双标签
- 标签必须闭合,且大小写敏感,不能交叉嵌套
- 必须有根元素(不含父元素的元素)
- 若有多个转义字符,可以使用
<![CDATA[文本]]>
来转义
解析XML
- 导入
dom4j.jar
- 创建一个
SAXReader
对象,调用其read("path")
读取xml文件,返回一个Document
类对象 - 调用Document对象的
getRootElement()
获取Document对象的根元素 - 通过根元素获取标签对象
element("子类标签名")
:通过标签名查找指定的标签,返回一个Element
类的标签对象elements("子类标签名")
:通过标签名查找指定的标签,返回一个list<Element>
类的标签集合对象
- 调用标签对象的
getText()
可以获取标签标签对象中的文本内容,返回一个String
类型 - 将获取到的值封装进对应的类中
elementText("标签名")
:获取指定标签名的文本内容,返回一个String
类型
attributeValue("属性名")
:获取指定属性名的属性值,返回一个String
类型
asXML()
:将标签对象转换为标签字符串
思路:
①加载配置文件,获取document对象
②获取根元素
③获取根元素下的每个标签中的子标签或属性或文本
TomCat
1)启动:
①:bin
目录下的startup.bat
文件
②:命令行输入cd bin文件目录
—>转盘符—>输入catalina run
2)测试:http://localhost:8080
、http://127.0.0.1:8080
3)关闭:
①:直接关闭窗口
②:在窗口界面按ctrl
+c
③:bin
目录下的shutdown.bat
文件
4)修改端口号:conf
目录下的server.xml
配置文件中的Connector
标签,修改port
属性值(端口号范围:1~65535),改完需重启TomCat服务器
- http协议默认端口号:80
5)部署Web工程:
①将工程目录拷贝进webapps
目录下即可
- 访问:
http://ip地址:服务器端口号/工程名/访问的文件名
②conf/Catalina/localhost
目录下,创建一个xml
文件
- 文件格式:
<Context path="xml文件名" docBase="工程目录" />
- 访问:
http://ip地址:服务器端口号/xml文件名/访问的文件名
6)注意点:
http://ip地址:服务器端口号/
:没有工程名,默认访问ROOT
工程http://ip地址:服务器端口号/工程名/
:没有资源名,默认访问index.html
页面
Servlet
Servlet程序实现
方式一:
-
编写一个类实现
Servlet
接口,实现所有方法 -
实现
Service
方法,用于处理请求,并响应数据 -
配置
web.xml
文件-
<servlet>
:配置Servlet程序<servlet-name>
:为Servlet程序起别名(常为类名)<servlet-class>
:Servlet程序的全类名- (可选)
<init-param>
:初始化参数<param-name>
:初始化参数的名字<param-value>
:初始化参数的值
-
<servlet-mapping>
:配置访问Servlet程序的地址-
<servlet-name>
:明确配置的地址给指定的哪个Servlet程序使用 -
<url-pattern>
:/自定义地址
/
解析时代表:http://ip地址:服务器端口号/工程名
/自定义地址
:即访问到Servlet程序的地址
-
-
(可选)
<context-param>
:<param-name>
:key<param-value>
:value
-
方式二:
- 编写一个类继承
HttpServlet
类 - 重写
HttpServlet
类中的doGet()
、doPost()
- 配置
web.xml
文件
生命周期:
①执行Servlet构造方法
②执行init
方法进行初始化
③执行service
方法
④执行destroy
进行销毁
- ①②在创建Servlet程序时会调用,③是每次访问网址时调用,④在停止web工程服务时调用
Servlet中的类
1)Selvice类:将service
方法中ServletRequest
类型的形参向下转型为HttpServletRequest
类型,调用其对象的getMethod()
,可以获取发送数据请求的为get
还是post
类型
2)ServletConfig类:Selvlet程序的配置信息类,可获取程序别名、初始化参数、ServletContext对象
①调用init
方法中ServletConfig
类型的形参的方法:
getServletName()
:获取Servlet程序的别名servlet-name的值getInitParameter("初始化参数的名字")
:获取初始化参数init-param的值getServletContext()
:获取ServletContext对象
②继承HttpServlet的类中重写的doGet
或doPost
方法后:
- 直接调用
getServletConfig()
可以直接获取到一个新的ServletConfig类型的变量- 每个ServletConfig只对唯一的Servlet程序有效
- 若该类重写了
init
方法,需要显示调用super.init(config)
,否则会报空指针异常
3)ServletContext类:表示Selvlet上下文,是一个接口,一个工程中只会有一个ServletContext对象的实例,且该对象是一个域对象
- 先调用
getServletContext()
获取一个ServletContext
类型的变量
getInitParameter("上下文参数的名字")
:获取上下文参数context-param的值getContextPart()
:获取当前工程的路径(/工程名)getRealPath(" ")
:获取工程("/"
)或资源("/资源名"
)在硬盘上的绝对路径setAttribute("key","value")
:设置域数据(同一个Servlet程序中获取的数据相同)getAttribute("key")
:获取对应域数据的值removeAttribute()
:删除数据
4)HttpServletRequest类:Tomcat服务器将每次发送请求的Http协议信息封装到此类的对象中并作为doGet和doPost方法中的参数供我们调用,可获取所有的请求信息
getRequestURI()
:获取请求的资源的路径getRequestURL()
:获取请求的资源的绝对路径getRemoteHost()
:获取客户端的ip地址getHeader("请求头")
:获取请求头相关信息getParameter("name")
:获取请求参数(name=value&
name=value)getParameterValues("name")
:获取请求参数(有多个参数时使用)getMethod()
:获取请求的方式(GET或POST)setAttribute("key","value")
:设置域数据(同一个请求中获取的数据相同)getAttribute("key")
:获取对应域数据的值getInputStream()
:获取输入流getRequestDispatcher("/地址")
:根据地址,获取到一个RequestDispatcher
类的对象,调用该对象的forward(HttpServletRequest,HttpServletResponse)
可直接访问该地址,从而实现请求的转发(在浏览器中访问了servlet程序的地址,而在servlet程序中访问了其他资源的地址)- 地址要以
/
开头,即访问的是必须是http://ip:port/工程名/
下的(webapp目录下)的资源,地址栏地址不变 - 请求的转发 的地址 可以访问到WEB-INF目录下
- 地址要以
setCharacterEncoding("字符编码")
:解决post请求中的乱码问题(必须在获取任意一个请求参数之前就使用,否则还会出现乱码问题)
5)HttpServletResponse类:同样是Tomcat服务器创建的对象,表示的是发送请求后所有的响应信息,可以用来设置返回给客户端的信息(流的方式)
- 两个流不能同时使用
- 字节流:
getOutputStream()
:常用于下载(传递二进制数据) - 字符流:
getWriter()
:常用于回传字符串- 调用
getWriter()
后返回PrintWriter
类的对象,调用该对象的write("str")
直接返回给客户端指定字符串 - 返回中文字符串时,可能出现中文乱码,需要将服务器编码集和浏览器编码集设为一致(要在获取流对象前设置)
- 调用
getCharacterEncoding()
:获取服务器的编码集(默认ISO-8859-1)setCharacterEncoding("字符编码集")
:设置服务器编码集setHeader("响应头","响应头参数")
:设置响应头Content-Type,text/html;charset=UTF-8
:设置浏览器编码集为UTF-8
setContentType("text/html;charset=UTF-8")
:设置服务器和客户端(响应头)的字符集为UTF-8setStatus(响应码)
:设置响应码setHeader("location","新地址的绝对路径")
:设置响应头,与响应码一起使用,重定向新的访问地址,实际上会有两次请求,地址栏地址发生变化,且两次请求为两个对象,不可访问WEB–INF下的资源,可访问外部连接sendRedirect("新地址的绝对路径")
:直接设置重定向地址- 绝对路径:/工程名/资源名
HTTP
请求
1)客户端–>服务器:请求
- 请求:GET、POST
GET请求:
form标签中使用method=get、a标签、link标签引入css、Script标签引入js文件、img标签引入图片、iframe标签引入html页面、浏览器输入地址后回车
①请求行
- 请求方式:GET
- 请求资源路径(+?+请求参数)
- 请求的协议和版本号:HTTP/1.1
②请求头:key:value(不同的键值对表示不同含义)
- Accept:告诉服务器客户端能接收的数据类型
- Accept-Language:告诉服务器客户端能接收的语言类型
- en-US(英语)、zh-CN(汉语)
- User-Agent:浏览器的信息
- Accept-Encoding:告诉服务器,客户端能接收的数据编码格式
- Host:表示请求的主机ip和端口号
- Connection:告诉服务器当前的连接如何处理
- Keep-Alive:回传数据后不要马上关闭连接,维持一段时间
- Closed:马上断开连接
POST请求:
form标签中使用method=post
①请求行:请求方式(POST)、请求的资源路径、请求的协议和版本号
②请求头
- Accept、Accept-Language、User-Agent、Host
- Referer:记录发起请求时的地址
- Content-Type:表示发送数据的类型
- application/x-www-form-urlencoded:表示提交的数据格式是name=value&name=value,然后对其进行url编码
- multipart/form-data:表示以多段的形式提交数据给服务器(以流的形式提交,用于上传)
- Content-Length:表示发送的数据的长度
- Cache-Control:表示如何控制缓存
- no-cache:不缓存
(空格一行)
③请求体:发送给服务器的数据
响应
2)服务器–>客户端:响应
①响应行
- 响应的协议和版本号:HTTP/1.1
- 响应状态码:
- 200(请求成功)
- 302(请求重定向)
- 404(服务器收到请求但数据不存在或地址错误)
- 500(服务器收到请求但服务器内部错误)
- 响应状态描述符:OK
②响应头
- Server:表示服务器信息
- Content-Type:响应体的数据类型
- MIME:大类型/小类型
- Content-Length:响应体的长度
- Date:请求响应的时间(格林时间)
(空格一行)
③响应体:回传给客户端的数据
JSP
jsp头部的page指令
language
:表示jsp翻译后为什么语言的文件(目前只支持Java)
contentType
:表示返回的数据类型
pageEncoding
:表示当前jsp页面的字符集
import
:导包、导类
autoFlush
:(out输出流专用)设置输出流缓冲区满了之后是否自动刷新缓冲区(默认为true)
buffer
:(out输出流专用)设置输出流缓冲区的大小,默认为8kb
errorPage
:设置jsp页面出错时自动跳转去的错误页面路径
isErrorPage
:设置当前jsp页面是否为错误信息页面(默认是false,true的话会生成异常类捕获异常信息)
session
:设置访问当前jsp页面是否会创建HttpSession对象(默认是true)
extends
:设置jsp文件被Java翻译出来后默认继承的类
脚本
1)声明脚本:
<%! java代码 %>
- 可声明属性、方法、静态代码块、内部类等
2)表达式脚本:用于在页面上输出数据
<% =表达式 %>
- 可输出基本数据类型、对象等
- 所有表达式脚本会翻译到
_jspService()
中 - 表达式脚本会被翻译为
out.print()
输出到页面上 - 表达式脚本可以调用
_jspService()
中的对象(脚本被翻译后存在于该方法中)
3)代码脚本:
<% java代码 %>
- 可写入条件语句、循环语句
- 代码脚本可以调用
_jspService()
中的对象(脚本被翻译后存在于该方法中) - 可由多个代码脚本共同组合成完整的代码语句,还可嵌套表达式脚本
EL表达式
使用
- 用于替换表达式脚本,主要用于输出jsp页面中的数据(特别时域对象中保存的数据)
${ 表达式 }
-
当域对象中都有相同的key时,会按照域的从小到大范围进行输出
-
在输出null值时,输出的为空串
-
在输出自定义类的对象时,直接调用对象的
toString()
在输出自定义类对象的属性值(
对象.属性名
)时,实质上调用的是对应属性名的get()
(获取属性值)不同类型属性输出值不同:
变量
:值数组
:数组地址,根据数组[下标]
找对应值集合List
:集合全部元素,根据集合[下标]
找对应值集合Map
:集合全部元素,根据集合.key值
找对应value值
运算符
①关系运算符:== / eq
(等于)、!= / ne
(不等于)、< / lt
(小于)、> / gt
(大于)、<= / le
(小于等于)、>= / ge
(大于等于)
②逻辑运算符:&& / and
(与)、|| / or
(或)、| / not
(非)
③算术运算:+
(加)、-
(减)、*
(乘)、/ / div
(除)、% / mod
(取余)
④empty运算${empty 表达式}
:判断数据是否为空,如果为空,返回true
- 值为null
- 值为空串
- 引用数据类型(Object)数组,长度为0
- List集合,元素个数为0
- Map集合,元素个数为0
⑤三元运算:条件 ? 表达式1 : 表达式2
⑥[]
运算符:Map['带有特殊符号的key的值']
- 输出指定下标的数组或List集合中的值
- 输出Map集合中含有特殊字符的key所对应的value值
⑦.
运算:调用get方法
隐含对象
①PageContextImpl pageContext
:获取jsp页面中的九大内置对象
${pageContext.九大内置对象}
即可获取九大内置对象,也可以.方法名
直接调用对象所拥有的方法(.
调用的是方法名所对应的get
方法,与调用get方法输出属性值类似)
②Map<String,Object> pageScope
:获取pageContext域中的数据
③Map<String,Object> requestScope
:获取request域中的数据
④Map<String,Object> sessionScope
:获取session域中的数据
⑤Map<String,Object> applicationScope
:获取servletContext域中的数据
⑥ Map<String,String> param
:获取jsp请求页面中请求参数的值
⑦Map<String,String[]> paramValues
:获取jsp页面中请求参数的值(?name=value & name=value
),在有多个值时使用
⑧Map<String,String> header
:获取请求头的信息
⑨Map<String,String[]> headerValues
:获取请求头的信息,多个值时使用
⑩Map<String,Cookie> cookie
:获取当前请求的Cookie的信息,可通过该Cookie获取到指定的Key或其对应的Value值
⑪Map<String,String> initParam
:获取在web.xml中配置的<context-param>
上下文参数
九大内置对象
HttpServletRequest类:request
:请求对象(域对象,一次请求内有效)
getScheme()
:获取请求的协议getServerName()
:获取请求的服务器的IP地址或域名getServerPort()
:获取请求的服务器的端口号getContextPath()
:获取当前工程路径(相对)getMethod()
:获取请求的方式(GET或POST)getRemoteHost()
:获取客户端的IP地址
response
:响应对象
PageContextImpl类:pageContext
:jsp的上下文对象(域对象,当前jsp页面范围内有效)
HttpSession类:session
:会话对象(域对象,一个会话范围内有效(打开浏览器访问服务器,直到关闭浏览器))
getID()
:获取会话的唯一标识
ServletContext类:application
:ServletContext对象(域对象,整个web工程内有效(web不停止,数据就在))
config
:ServletConfig对象
out
:jsp输出流对象
page
:指向当前jsp的对象
exception
:异常对象
out.wirte()
、out.print()
和response.getWriter().write()
都可以用来输出数据给客户端- jsp页面中的所有代码执行完后,会执行一下两个操作:
- 执行
out.flush()
,将out缓冲区的数据追加写入到response缓冲区中 - response执行刷新操作,将数据写给客户端
- 执行
out.print()
:可用于输出任意类型数据(会先将任意类型数据先转化为字符串后再调用write()
)out.write()
:可输出字符串(会将任意类型数据先转化为char
类型再输出)
常用标签
1)静态包含:
<%@ include file="/jsp页面路径" %>
- 实质上是将被包含的jsp文件的代码拷贝到包含的位置处 调用
out.write()
输出
2)动态包含:
<jsp:include page="/jsp文件路径" >
(可选)<jsp:param name="参数名" value="参数值">
</jsp:include>
- 实质上是执行了
JspRuntimeLibrary(requesst,response,"/剪视频文件路径",out,false)
代码去调用jsp页面 - 该方法共用了九大内置对象
- 可选部分为传递参数,可用
request.getParameter("name")
获取值
3)请求转发:
<jsp:forward page="/跳转路径"></jsp:forward>
- 与调用
request.getRequestDispatcher("/跳转路径").forward(request,response)
效果完全一样
监听器
- 三大组件:Servlet程序、Filter过滤器、Listener监听器
- 接口,监听某事物的变化,通过回调函数,反馈给客户(程序)去做对应的处理
ServletContextListener监听器:监听ServletContext对象的创建(web工程创建时)和销毁(web工程停止时)
contextInialized(ServletContextEvent sce)
:在ServletContext对象创建后调用,做初始化contextDestroyed(ServletContextEvent sce)
:在ServletContext对象销毁后调用
使用步骤:
-
编写一个类实现ServletContextListener接口
-
调用其两个回调方法
-
web.xml中配置监听器
-
<listener>
<listener-class>
</listener-class>
</listener>
-
JSTL标签库
- 替换代码脚本
1)导入标签库的jar包:taglibs-standard-impl.jar
、taglibs-standard-spec.jar
2)使用taglib指令引入标签库:
-
CORE标签库:
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
-
XML标签库:
<%@ taglib prefix="x" uri="http://java.sun.com/jsp/jstl/xml" %>
-
FMT标签库:
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fml" %>
-
SQL标签库:
<%@ taglib prefix="sql" uri="http://java.sun.com/jsp/jstl/sql" %>
-
FUNCTIONS标签库:
<%@ taglib="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
3)常用标签:
①<c:set />
:往域中保存数据
scope
:设置保存的域- page:PageContext域(默认)
- request:Request域
- session:Session域
- application:ServletContext域
var
:设置key值value
:设置value值
②<c:if></c:if>
:判断
test
:test内的El表达式成立,则输出标签间的内容
③<c:choose>
:多情况判断
<c:when test="表达式"></c:when>
:当test表达式的值为true,执行when标签
<c:otherwise></c:otherwise>
:相当于switch-case的default
</c:choose>
- 标签内只能使用jsp注释
- when的父标签一定是choose
- otherwise标签内可以嵌套choose-when
④<c:forEach></c:forEach>
:遍历
begin
:遍历开始索引end
:遍历结束索引var
:当前正在遍历的数据items
:遍历的数据(集合(Map为键值对)、数组等)step
:遍历时的步长(迭代时的步长)varStatus
:当前遍历到的数据的状态current
:获取当前所遍历的数据index
:获取遍历的索引count
:当前是遍历的第几个first
:当前遍历的数据是否位于第一条last
:当前遍历的数据是否位于最后一条begin
:获取begin属性值end
:获取end属性值step
:获取step属性值
使用begin-end,var则代表从索引开始到结束
使用items,var则代表items所要遍历的数据
使用EL表达式
${}
获取域中的数据作为items所要遍历的数据使用EL表达式
${}
获取var的值获取到Map的键值对后可通过
.key
或.value
获取对应的key或value
文件上传与下载
1)上传文件:(post)
-
要有
form
标签,属性值method=post
,enctype=multipart/form-data
- get有数据大小限制,所以选用post
- enctype=multipart/form-data表示提交的数据以多段(每个表单项为一个数据段)的形式进行拼接,然后以二进制流的形式发送给服务器
- 请求头中Content-Type表示提交的数据类型
boundary
是系统每次随机生成的数据段分隔符,分隔符末尾带--
是数据的结束标记
- 每段数据以分隔符开始,最后以分隔符结束,数据段以分隔符开始后,包含:①对数据的描述 ②空行 ③上传的数据
-
使用
<input type="file" name=""/>
提交需要上传的文件 -
在Servlet程序中对数据进行解析和保存(先导包)
-
先
ServletFileUpload.isMultipartContent(req)
判断上传的数据是否是多段 -
通过
new DiskFileItemFactory()
创建一个FileItemFactory
工厂的实现类对象,将其作为参数创建一个ServletFileUpload(FileItemFactory)
工具类的对象 -
调用工具类对象的
parseRequest(req)
来解析上传的数据,得到一个封装了每一个表单项的List<FileItem>
集合 -
循环遍历(增强for循环)获取每一个
FileItem
类型的表单项,调用表单项对象的isFormField()
判断每一个表单项是普通数据类型,还是上传的文件普通表单项:
- 调用表单项对象的
getFiledName()
来获取表单项的name属性值 - 调用表单项对象的
getString("UTF-8")
来获取表单项的value属性值
上传的文件:
- 调用表单项对象的
getName()
获取上传的文件名 - 调用表单项对象的
write(new File("path"+"name"))
将指定名字的文件保存在指定路径的位置处
- 调用表单项对象的
-
2)下载文件:(get)
-
获取要下载的文件名fileName
-
在下载前需要先知道下载的文件类型(不同文件下载后的格式不一样)
-
调用
getServletContext()
获取ServletContext
对象 -
调用
ServletContext
对象的getMimeType("path"+fileName)
获取要下载的文件的数据类型(返回String类型对象)/
映射到当前工程目录的web下
-
调用
resp.setContentType(数据类型)
,通过响应头告诉客户端返回的数据类型 -
调用
resp.setHeader("Content-Disposition","attachment;filename="+fileName)
,设置并通过响应头告诉客户端这个数据是用于下载的-
Content-Disposition响应头,表示收到的数据的处理方式
attachment:表示数据为附件,下载使用
filename:表示所下载的文件的名
- 若下载的文件名为中文,需要调用
URLEncoder.encode("filename","UTF-8")
转换为UTF-8编码集的样式,否则会出现乱码
- 若下载的文件名为中文,需要调用
-
-
-
读取要下载的文件内容
- 调用
ServletContext
对象的getResourceAsStream("path"+fileName)
获取要下载的文件的一个InputStream
流
- 调用
-
将要下载的文件内容回传给客户端
- 调用
resp.getOutputStream()
获取响应给客户端的输出流 - 若已导入
commons-io.jar
,直接调用IOUtils.copy(InputStream,OutputStream)
将文件的输入流内容复制给客户端的输出流
- 调用
3)解析上传的数据:
- 导入jar包:
commons-io.jar
、commons-fileupload.jar
ServletFileUpload类:用于解析上传的数据
FileItem类:表示每个表单项
boolean ServletFileUpload.isMultipartContent(HttpServletRequest request)
:判断上传的数据是否为多段数据public List<FileItem> parseRequest(HttpServletRequest request)
:解析上传的数据boolean FileItem.isFormField()
:判断表单项是否为普通的表单项还是文件类型,true则是普通表单项String FileItem.getFieldName()
:获取表单项的name属性值String FileItem.getString()
:获取表单项的值,可传参数"UTF-8"
来防止出现乱码String FileItem.getName()
:获取上传的文件名void FileItem.write(file)
:将上传的文件写入到file所指向的硬盘位置
Cookie
创建Cookie:
- 创建Cookie对象:
new Cookie("key","value")
- 通知客户端保存Cookie:
response对象.addCookie(Cookie)
- 通过响应头Set-Cookie通知客户端保存Cookie(Set-Cookie:key=value)
- 在收到Set-Cookie响应头时,会先查看有无该Cookie,没有则创建,有则修改
- 可以一次性保存多个Cookie,一个Cookie的大小不能超过4kb
获取Cookie:
-
调用
request对象.getCookies()
,返回一个Cookie[]
数组- 客户端通过请求头Cookie:key=value把Cookie信息发送给服务器
-
要获取指定key的Cookie时,只能循环遍历,判断Cookie的key与所要的是否相同
-
Cookie对象.getName()
:获取Cookie的keyCookie对象.getValue()
:获取Cookie的value
修改Cookie:
①调用构造器:
- 创建同名的Cookie对象:
new Cookie("sameKey","newValue")
- 通知客户端保存修改:
response对象.addCookie(Cookie)
②调用方法:
- 找到所要修改的Cookie的对象(for循环遍历获取)
- 调用
cookie对象.setValue("newValue")
修改value值- 中文等会乱码,需要用Base64编码
- 通知客户端保存修改:
response对象.addCookie(Cookie)
设置Cookie存活时间:
-
调用
cookie对象.setMaxAge(s)
设置-
s为存活的秒数
s为负数时(默认),为会话级别,退出浏览器时销毁Cookie
s为0时,立即删除Cookie
s为正数时,在s秒后删除Cookie
-
设置Cookie有效路径:
- 调用
Cookie对象.setPath("绝对路径")
- 该路径及该路径下所有的子路径在请求时都会发送该Cookie
Session
创建Session:
- 调用
request对象.getSession()
创建Session对象- 第一次调用时是创建Session,之后调用是调用创建好的Session
session对象.isNew()
可以判断是否为新创建的Session,返回boolean值- 每个Session会有一个唯一的ID
Session中存取数值:
- 调用
session对象.setAttribute("key","value")
存放数据 - 调用
session对象.getAttribute("key")
取数据
设置和获取Session的超时时长:
-
调用
session对象.setMaxInactiveInterval(s)
设置Session的超时时长-
s为存活的秒数
-
当s为正数时,设置s秒后销毁Session,当s为负数时,设置为永不销毁
-
s的默认时长为30(分钟),在Tomcat服务器配置文件web.xml中有设定,可以在工程的web.xml中配置以下:
<session-config>
<session-timeout>存活分钟</session-timeout>
</session-config>
-
-
调用
session对象.getMaxInactiveInterval()
获取Session的超时时长- Session超时时长为:客户端两次请求间的间隔时长
-
调用
session对象.invalidate()
让当前Session立即失效
Filter过滤器
①请求拦截、响应过滤
②权限配置(实现doFilter方法)
③使用Filter过滤器统一处理事务
- web.xml中配置url为
/*
可以确保所有的请求都会经过Filter过滤器处理,若在执行的所有路径中有可能有异常的进行抛出,并由doFilter()
进行异常的捕获,最后判断是否提交或回滚,由此来实现事务的管理
(一)web.xml文件配置:
<filter>
<filter-name>
名称</filter-name>
<filter-class>
实现的类的全类名</filter-class>
<init-param>
(可选、可多选)
<param-name>
name </param-name>
<param-value>
value </param-value>
</init-param>
</filter>
<filter-mapping>
<filter-name>
对应名称</filter-name>
<url-pattern>
拦截的目标 </url-pattern>
(可多选)
-
拦截的三种目标:
/ :http://localhost:8080/工程路径/
/资源名
:精确匹配,拦截所有想访问指定资源的程序/目录/*
:目录匹配,拦截所有想访问指定目录下的资源的程序*.文件类型
:后缀名匹配,拦截所有想访问相关后缀名的文件的程序
</filter-mapping>
(二)实现步骤:
①实现javax.servlet.Filter
下的Filter
接口(需导包)
②根据实现Filter的类来配置web.xml文件,限制访问哪些资源需要经过doFilter过滤
③将需要进行请求拦截的内容在doFilter()
内实现
ServletRequest
类要强转为HttpServletRequest
类才能获取session域
④调用参数的方法filterChain.doFilter(servletRequest,servletResponse)
实现请求的放行
- 缺少该步骤的话,即使检查通过,也不会访问到目标资源
(三)Filter过滤器的生命周期
①构造器
、init()
初始化:在Filter过滤器创建时执行
②doFilter()
:每次拦截时执行
③destroy()
:web服务停止时执行销毁
(四)Filter过滤器参数中的类
-
FilterConfig
类:getFilterName()
:获取web.xml文件中所对应的的文本值getInitParameter("name")
:获取web.xml文件中下的下的name所对应的value值getServletContext()
:获取ServletContext对象
-
FilterChain
过滤器链:-
doFilter()
:若有多个Fliter过滤器,执行下一个过滤器,否则访问目标资源-
Filter过滤器的执行顺序是按Filter在web.xml中的配置顺序执行的
-
默认情况下所有Filter过滤器及目标资源处在同一线程
-
多个Filter过滤器及目标资源共享一个request对象
-
执行顺序:(假设两个过滤器)
filter1前——doFilter1——filter2前——doFilter2——目标资源——filter后2——filter后1
- 若其中任意过滤器执行完后无doFilter,则会直接返回(不会访问目标资源)
-
-
(五)ThreadLocal
- 每个线程中可以为其关联一个数据,可以使用ThreadLocal来关联数据
- 其关联方式类似于Map(其key值为String类型,存放当前线程名,value值存放想要在该线程中所相关联的数据的值)
- 其作用是为了解决线程安全问题(比如事务回滚问题(保存同一个Connection对象)(用后记得将保存的ThreadLocal值
remove()
)) - 创建的ThreadLocal对象一般为
static
修饰 - 调用ThreadLocal对象的
set(数值)
来存储关联的值(每个ThreadLocal对象只能关联一个数据值,本质是根据线程名来存储) - 调用ThreadLocal对象的
get()
来获取关联的值(本质是根据线程名来获取)
JSON
-
本质是一个对象
-
有两种存在形式:对象(常用于操作JSON中的数据)、字符串(常用于获取JSON中的数据)
-
JSON.stringify(JSON对象)
:将JSON对象转换为字符串形式JSON.parse(JSON对象)
:将JSON对象转换为对象形式
-
(一)客户端:(javascript下)
变量:
var 变量名={
"key1" : 值1 ,
"key2" : 值2 ,
…
}
取值:
变量名.key
- 数组的话可根据下标获取指定的值,否则打印数组内全部数据
- JSON内可嵌套JSON
(二)服务器:(导包:gson.jsp
)
-
JavaBean中:
- 创建Gson对象
- 调用
Gson对象.toJson(Java类对象)
可将java对象转换为JSON字符串类型对象(返回类型为String类型) - 调用
Gson对象.fromJson(JSON对象,Java类.class)
可将JSON对象转化为指定的Java类的对象
-
List、Map中:(list与map方法类似)
-
创建一个Gson对象
-
调用
Gson对象.toJson(list对象)
可将list对象转换为JSON字符串类型对象(返回类型为String类型) -
调用
Gson对象.fromJson(JSON对象,TypeOfT)
可将JSON对象转换为list集合对象-
TypeOfT是一个Type类型 ,获取方法:
创建一个(匿名)类,该类继承了
TypeToken<集合类型<泛型类型>>
,最后调用该类的getType()
即可获取 -
建议直接使用匿名子类(
new TypeToken<集合类型<泛型类型>>(){}
的方式调用getType()
)
-
-
AJAX
特点:局部更新、异步请求与响应
(一)请求与响应:(JavaScript下)
var 变量名 = new XMLHttpRequest()
创建一个XMLHttpRequest类- 创建一个servlet程序,配置web.xml文件
- 调用
XMLHttpRequest变量名.open("请求方式",”servlet程序访问地址“,true)
- true:异步
- (响应所需,无响应时略过)
- 因为为异步,因此servlet程序中数据的响应格式需要为字符串类型对象(因此使用JSON字符串类型对象(调用
toJson()
)) - 使用
XMLHttpRequest变量名.onreadystatechange = function(){}
绑定事件 - 在事件中判断
XMLHttpRequest变量名.readyState==4&&XMLHttpRequest变量名.status==200
,条件成立时才能调用XMLHttoRequest变量名.responseText
获取到一个JSON字符串类型对象(可调用JSON.parse(JSON对象)
转换为JSON对象以便美观输出)
- 因为为异步,因此servlet程序中数据的响应格式需要为字符串类型对象(因此使用JSON字符串类型对象(调用
- 调用
XMLHttpRequest变量名.send()
发送请求
(二)Jquery中使用AJAX:
①$.ajax({ })
-
url
:请求地址 -
data
:请求参数(key=value
) -
type
:请求方式 -
success:function(变量名){}
:请求后的响应事件变量名
:响应 的对象
-
dataType
:决定响应对象的类型-
text
:text纯文本xml
:xml文本的数据格式json
:JSON对象类型的对象
-
②$.get("url地址","请求参数","请求响应后的响应事件","响应对象的类型")
- 请求方式已确定为
get
请求
③$.post("url地址","请求参数","请求响应后的响应事件","响应对象的类型")
- 请求方式已确定为
post
请求
④$.getJSON("url地址","请求参数","请求响应后的响应事件")
- 请求方式已确定为
get
请求,响应对象的类型确定为JSON对象类型
⑤$("选择器").serialize()
:获取表单提交的全部数据
- 数据的格式为
key=value&key=value
所拼接 - 在请求转发到servlet程序时,确保在
data
(请求参数)中添加&
才能获取到请求参数
i18n
思路:
- 创建一个
baseName_localeName.properties
的配置文件- baseName:共有、通用的名字
- localName:指定地区语言的名字
- 配置文件内以key=value的形式保存,key为英文,value为对应的地区的语言
- 获取locale对象
Locale.getDefault()
:获取当前系统默认的地区语言的locale对象Locale.getAvailableLocales()
:获取集合全部的地区语言的locale对象Locale.CHINA()
:获取zh_CN
的locale对象Locale.US()
:获取en_US
的locale对象
- 调用
ResourceBundle.getBundle("baseName",locale对象)
获取到一个ResourceBundle对象 - 根据ResourceBundle对象调用其
getString("properties文件的key")
获取到key所对应的value值(根据locale对象所对应的地区语言获取)
(一)请求头方式实现网页语言的国际化
<%
- 配置properties文件(key=value形式来表示页面上所有用到多种语言的文本,每种语言都要用properties文件)
Locale.getLocale()
获取到通过locale对象- 调用
ResourceBundle.getBundle
创建一个ResourceBundle对象
%>
之后在所有用到多种语言的文本处,使用
<%= ResourceBundle对象.getString("baseName",locale对象) %>
来表示文本,当浏览器默认语言不同时,就会自动更改网页的语言
(二)根据用户选择实现网页语言的国际化
- 每种语言用
链接标签<a></a>
表示 - 链接标签的
属性href
链接到当前网页,附带一个参数用来区分不同地区的语言 - 之后与上述方法一样,但在获取locale对象时,要根据参数(
request.getParameter("参数名")
)来进行判断(根据不同地区语言获取不同的locale对象,默认情况再使用Locale.getDefault()
)
(三)使用JSTL标签库实现网页语言的国际化
- 导包
taglibs-standard-impl.jar
、taglibs-standard-spec.jar
- 引入头标签
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
- 根据用户选择的语言,使用
链接标签
传递对应语言的参数 = 对应地区的locale值
- 使用
< fmt:setLocale value="${param.参数名}" />
设置locale的值 - 使用
< fmt:setBundle basename=对应properties文件的baseName />
设置bundle对象 - 在所有需要用到不同语言的文本处,使用
< fmt:message key="properties文件内对应的key" />
替换 - 当用户选择不同语言时,根据参数传递不同语言的locale对象,根据locale对象和baseName获取到bundle对象,再根据bundle对象中对应的key获取对应的value
零碎知识点
JS和jQuery的页面加载完成之后
-
JS:
window.onload=function(){}
-
jQuery:
$(function(){})
、$(document).ready(function(){})
1)触发时间:
JS:页面加载好后,创建所有标签的DOM对象,并将标签显示内容加载完成
jQuery:页面加载好后,创建所有标签的DOM对象后就执行
2)执行次数:
JS:只会执行最后一次赋值的函数
jQuery:执行所有的function函数,按顺序执行
base标签
相对路径在跳转时会根据当前页面地址栏中的地址进行跳转,使用base标签可以设置跳转时的相对路径
<base href="绝对路径"/>
- href的属性值变成 相对路径前的地址,当页面以相对路径进行跳转时,会在该地址的基础上进行跳转
- 绝对路径下的资源名可以省略(跳转是在目录的基础上跳转(
/
、..
),与资源名无关)
web中/的不同意义
被浏览器解析:http://ip:port
被服务器解析:http://ip:port/工程名
response.sendRediect("/")
:将/发送给浏览器解析,得到http://ip:port
BeanUtils工具类
- 将客户端的表单信息快速封装进自定义类中
导包:commons-logging.jar
、commons-beanutils.jar
BeanUtils.populate(Object,Map)
- Object为要将数据封装进去的类(先获取name属性值,再将值封装进Object类中)
- 可调用
req.getParameterMap()
,获取客户端的表单信息并封装进一个Map集合中,作为populate的另一个参数 - 本质是获取name与其值后,调用类中同名的set方法
表单重复提交
①在用户提交表单后,因为浏览器会记录下最后一次请求的信息,服务器若使用请求转发进行页面跳转,当用户按功能键(Ctrl+F5)刷新时,会重新发起浏览器的最后一次请求。
- 解决方法:改用请求转发为重定向
②用户提交表单,但可能出现网络延迟,导致用户多次提交表单
- 解决办法:使用验证码
③用户提交表单,服务器也正常跳转,但提交完成后,用户在浏览器页面下进行回退,重新提交表单
- 解决办法:使用验证码
请求转发与重定向
1)请求转发:
- 客户端向服务器发送一个请求,(客户端发送的)请求地址没有变化,服务器调用内部方法将请求转发到新地址进行处理,处理完后将结果返回给客户端
- 请求转发的方式只会有一次客户端对服务器的请求,服务器对客户端的响应,因此浏览器地址栏显示的依旧为第一次访问的原地址(
request对象保持不变
) - 请求转发只能访问当前工程web下的资源,但可以访问WEB-INF下的资源,且
request.setAttribute()
域内保存的数据,新页面可以获取
2)重定向:
- 客户端向服务器发送一个请求,(客户端发送的)请求地址已发生了变化,服务器向客户端发送了一个全新的地址,此刻客户端会自动访问新的地址,服务器将新的地址内容返回给客户端
- 客户端发起了两次请求,服务器进行了两次响应,且浏览器地址栏显示的为第二次请求访问的新地址(
request对象发生了改变
) - 重定向可以访问其他工程下的资源,但不可访问WEB-INF下的资源,且
request.setAttribute()
域内保存的数据,新页面获取不到
验证码
-
导入谷歌验证码jar包
kaptcha.jar
-
配置web.xml文件用于生成验证码的Servlet程序
<servlet-class>
com.google.code.kaptcha.servlet.KaptchaServlet
</servlet-class>
-
在表单中使用img标签引用到servlet地址处并获取到验证码图片
-
服务器中获取谷歌生成的验证码并和客户端发送的验证码进行比较
- 使用
request对象.getSession().getAttribute(KAPTCHA_SESSION_KEY)
获取Session中的验证码 - 获取到验证码、保存到String中后应立即调用
request对象.getSession().removeAttribute(KAPTCHA_SESSION_KEY)
销毁验证码
- 使用
-
绑定单击事件,使用
this.src="绝对路径?time="+new Date()
直接访问web.xml下kaptcha的servlet程序,可以起到单击图片切换验证码的效果,且由于有参数Date的作用,因此不会因为缓存而切换不了验证码
异常处理
步骤:配置web.xml文件,设计好跳转的页面,并将异常往外抛出,由Tomcat服务器捕获
<error-page>
<error-code>
错误码 </error-code>
<location>
跳转的页面地址 </location>
- / :http://localhost:8080/工程名/
</error-page>
BindException
netstat -ano|findstr 端口号
:查看占用端口的程序
taskkill /F /PID 端口id
:结束端口占用
请求头
req.getHeader()
:可以获取对应的请求头
Referer
:获取发起请求的绝对路径(可用于购物车添加后返回原页面)