1.什么是jsp

JSP全名是Java Server Pages,它是建立在Servlet规范之上的动态网页开发技术;

2.jsp基本语法

JSP全名是Java Server Pages,它是建立在Servlet规范之上的动态网页开发技术;

1
2
3
<%
定义变量或方法
%>

在chaptero6项目的WebContent目录下创建一个名称为example01.jsp的文件,在该文件中编写声明语句

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Insert title here</title>
</head>
<%!
int a=1 ,b=2;
%>
<%!
public String print(){
String str = "pidan";
return str;
}
%>
<body>
<%
out.println(a+b);
%>
<br/>
<%
out.println(print());
%>
</body>
</html>

启动Tomcat并在浏览器访问example01.jsp文件
JSP表达式(expression)用于将程序数据输出到客户端,它将要输出的变量或者表达式直接封装在以“<%=”开头和以“%>”结尾的标记中,其基本的语法格式

1
2
<%=a+b %><br/>
<%=print() %>

jsp注释
同其他各种编程语言一样,JSP也有自己的注释方式,其基本语法格式
java <%--注释信息--%>
在chapterO6项目的WebContent目录下创建一个名称为example02的JSP页面

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Insert title here</title>
</head>
<body>
<!-- 这是一个HTML注释 -->
<%--这是一个JSP注释 --%>
</body>
</html>

启动Tomcat并在浏览器访问example02.jsp文件,按F12查看源文件

jsp指令

1.include指令
在chapterO6项目的WebContent目录下
创建两个JSP页面文件date.jsp和include.jsp,在clude.jsp文件中使用 include指令将date.jsp文件包含其中

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Insert title here</title>
</head>
<body>
<%
out.println(new java.util.Date().toLocaleString());
%>
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<title>欢迎你</title>
</head>
<body>
欢迎你pidan,现在的时间是:
<%@
include file="date.jsp"
%>
</body>
</html>

启动Tomcat并在浏览器访问include.jsp文件

2.jsp隐式对象
在chapterO6项目的WebContent目录下创建一个名称为out.jsp页面

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<%@ page language="java" contentType="text/html; charset=utf-8"
buffer="0kb"%>
<!DOCTYPE html>
<html>
<head>
<title>Insert title here</title>
</head>
<body>
<%
out.println("first line<br />");
response.getWriter().println("sercond line<br />");
%>
</body>
</html>

启动Tomcat并在浏览器访问out.jsp文件

在chapterO6项目的WebContent目录下创建一个名称为pageContext.jsp页面

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<%@ page language="java" contentType="text/html; charset=utf-8"%>
<!DOCTYPE html>
<html>
<head>
<title>Insert title here</title>
</head>
<body>
<%
HttpServletRequest req=(HttpServletRequest)pageContext.getRequest();

pageContext.setAttribute("req11","pageContext",pageContext.PAGE_SCOPE);
pageContext.setAttribute("req22","dashuju",pageContext.REQUEST_SCOPE);
pageContext.setAttribute("req33","session",pageContext.SESSION_SCOPE);
pageContext.setAttribute("req","application",pageContext.APPLICATION_SCOPE);
%>
<%=pageContext.findAttribute("req") %>
<hr />
<%=(String)req.getAttribute("req22") %>
</body>
</html>

启动Tomcat并在浏览器访问pageContext.jsp文件

在chapterO6项目的WebContent目录下创建一个名称为exception.jsp的页面,在其中编发生异常的代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8" errorPage="error.jsp"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<%
int a=3;
int b=0;
%>
输出:<%=a/b %>
</body>
</html>

在WebContent目录下创建一个名称为error.jsp的页面,
在其中获取从exception.jsp页面中传递过来的exception对象。在其page指令中要将 isErrorPage属性设置为true

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8" isErrorPage="true"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
输出异常信息:<%=exception.getMessage() %>
<br/><br/>
2020080604029HYS
</body>
</html>

3.动作元素
(1)在chapterO6项目的WebContent目录下编写两个JSP文件,分别是included.jsp和dinclude.jsp。
其中,dinclude.jsp 页面用于引入 included.jsp 页面。included.jsp作为被引入的文件,让它暂停5秒钟后才输出内容,这样,可以方便测试jsp:include标签的flush属性。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<%Thread.sleep(5000); %>
included 被包含的页面

</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
dinclude页面用来包含其他页面
<br/>
<jsp:include page="included.jsp" flush="true"></jsp:include>
</body>
</html>

编写一个用于实现转发功能的 jspforward.jsp页面和一个用于显示当前时间的welcome.jsp页面

1
2
3
4
5
6
7
8
9
10
11
12
13
14

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
转发到其他页面:
<jsp:forward page="welcome.jsp"></jsp:forward>
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
我是welcome文件
</body>
</html>

2.阶段案例:传智书城JSP页面

在chapter06项目的WebContent目录下创建一个名称为index.jsp的页面文件,该文件使
jsp:forword>动作元素跳转到项目客户端展示的首页,其主要代码
<jsp:forward page="/client/index.jsp"></jsp:forward>
将第1章中传智书城案例中的client文件夹复制到WebContent目录下,并将client文件夹下的所有.html文件改为.jsp文件

如果此时运行项目,并访问“http://localhost:8080/chapter06/client/index.jsp”,会发现页面中的中文都是乱码。需要将每一个JSP文件中都加上page指令

page language
1
pageEncoding="UTF-8"%>

此时当点击“新用户注册”链接后,所访问的链接路径是/chapternfregister.jsp,而项目中注册页面的真实路径是/chapter06/client/register.jsp,所以出现了“404错误。要解决此问题,只需在index.jsp页面文件中的链接和图片等路径前,加入“${pageContext.request.contextPath}/client/”

1
<a href="${pageContext.request.contextPath}/register.jsp">新用户注册</a>

在client文件夹下创建一个名称为head.jsp的文件,将传智书城 index.jsp中顶部的代码抽取出到head.jsp中。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<div id="divhead">
<table cellspacing="0" class="headtable">
<tr>
<td>
<a href="#">
<img src="${pageContext.request.contextPath}/client/images/logo.png" width="200" height="60" border="0" />
</a>
</td>
<td style="text-align:right">
<img src="${pageContext.request.contextPath}/client/images/cart.gif" width="26" height="23" style="margin-bottom:-4px" />&nbsp;<a href="#">购物车</a>
| <a href="#">帮助中心</a>
| <a href="#">我的帐户</a>
| <a href="${pageContext.request.contextPath}/client/register.jsp">新用户注册</a>

</td>
</tr>
</table>
</div>

在client文件夹下创建一个名称为menu_search.jsp的文件,将传智书城index.jsp中菜单列表中的代码抽取出到menu_search.jsp中。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<div id="divmenu">
<a href="#">文学</a>
<a href="#">生活</a>
<a href="#">计算机</a>
<a href="#">外语</a>
<a href="#">经管</a>
<a href="#">励志</a>
<a href="#">社科</a>
<a href="#">学术</a>
<a href="#">少儿</a>
<a href="#">艺术</a>
<a href="#">原版</a>
<a href="#">科技</a>
<a href="#">考试</a>
<a href="#">生活百科</a>
<a href="#" style="color:#FFFF00">全部商品目录</a>
</div>
<div id="divsearch">
<form action="#" id="searchform">
<table width="100%" border="0" cellspacing="0">
<tr>
<td style="text-align:right; padding-right:220px">
Search
<input type="text" name="textfield" class="inputtable" id="textfield" value="请输入书名"
onmouseover="this.focus();"
onclick="my_click(this, 'textfield');"
onBlur="my_blur(this, 'textfield');"/>
<a href="#">
<img src="${pageContext.request.contextPath}/client/images/serchbutton.gif" border="0" style="margin-bottom:-4px" onclick="search()"/>
</a>
</td>
</tr>
</table>
</form>
</div>

在client文件夹下创建一个名称为foot.jsp的文件,将传智书城 index.jsp中底部的代码抽取出到foot.jsp中。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<div id="divfoot">
<table width="100%" border="0" cellspacing="0" >
<tr>
<td rowspan="2" style="width:10%">
<img src="${pageContext.request.contextPath}/client/images/logo.png" width="195" height="50"
style="margin-left:175px" />
</td>
<td style="padding-top:5px; padding-left:50px">
<a href="#">
<font color="#747556"><b>CONTACT US</b></font>
</a>
</td>
</tr>
<tr>
<td style="padding-left:50px">
<font color="#CCCCCC">
<b>COPYRIGHT 2015 &copy; BookStore All Rights RESERVED.</b>
</font>
</td>
</tr>
</table>
</div>

使用include指令将抽取出的3个JSP页面包含在index.jsp中。