首页 > 编程语言 >老杜 JavaWeb 讲解(十八) ——项目优化(Servlet+JSP+EL+JSTL)

老杜 JavaWeb 讲解(十八) ——项目优化(Servlet+JSP+EL+JSTL)

时间:2023-08-03 12:55:29浏览次数:43  
标签:EL JavaWeb color border dept 部门 jsp ERROR Servlet

(十六)项目优化(Servlet+JSP+EL+JSTL)

相关视频:

55-EL表达式JSTL和base标签改造OA

新旧代码对比:

注意点:

Java代码不需要改动,只需要更改jsp代码。

将需要的包导入:

  • jakarta.servlet.jsp.jstl-2.0.0.jar

  • jakarta.servlet.jsp.jstl-api-2.0.0.jar

  • mysql-connector-j-8.0.31.jar

add.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
	<head>
		<meta charset="utf-8">
		<title>新增部门</title>
	</head>
	<body>
	<h2>欢迎<%=session.getAttribute("username")%></h2>
		<h1>新增部门</h1>
		<hr>
		<form action="<%=request.getContextPath()%>/dept/save" method="post">
			部门编号:<input type="text" name="deptno"/><br>
			部门名称:<input type="text" name="deptname"/><br>
			部门位置:<input type="text" name="loc"/><br>
			<input type="submit" value="保存"/><br>
		</form>
	</body>
</html>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
	<head>
		<meta charset="utf-8">
		<title>新增部门</title>
	</head>
	<body>
	<h2>欢迎${username}</h2>
		<h1>新增部门</h1>
		<hr>
		<form action="${pageContext.request.contextPath}/dept/save" method="post">
			部门编号:<input type="text" name="deptno"/><br>
			部门名称:<input type="text" name="deptname"/><br>
			部门位置:<input type="text" name="loc"/><br>
			<input type="submit" value="保存"/><br>
		</form>
	</body>
</html>

detail.jsp

<%@ page import="com.zwm.oa.bean.Dept" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<%
	Dept dept = (Dept)request.getAttribute("dept");
%>
<html>
	<head>
		<meta charset="utf-8">
		<title>部门详情</title>
	</head>
	<body>
		<h2>欢迎<%=session.getAttribute("username")%></h2>
		<h1>部门详情</h1>
		<hr>
		部门编号:<%=dept.getDeptno()%>			<br>
		部门名称:<%=dept.getDname()%>			<br>
		部门位置:<%=dept.getLoc()%>		        <br>

		<input type="button" value="后退" onclick="window.history.back()"/>
	</body>
</html>
<%@ page import="com.zwm.oa.bean.Dept" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
	<head>
		<meta charset="utf-8">
		<title>部门详情</title>
	</head>
	<body>
		<h2>欢迎${username}</h2>
		<h1>部门详情</h1>
		<hr>
		部门编号:${dept.deptno}			<br>
		部门名称:${dept.dname}			<br>
		部门位置:${dept.loc}		    <br>
		<input type="button" value="后退" onclick="window.history.back()"/>
	</body>
</html>

edit.jsp

<%@ page import="com.zwm.oa.bean.Dept" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
	Dept dept = (Dept)request.getAttribute("dept");
%>
<html>
	<head>
		<meta charset="utf-8">
		<title>修改部门</title>
	</head>
	<body>
		<h2>欢迎<%=session.getAttribute("username")%></h2>
		<h1>修改部门</h1>
		<hr>
		<form action="<%=request.getContextPath()%>/dept/modify" method="post">
			部门编号:<input type="text" name="deptno" value="<%=dept.getDeptno()%>" readonly/><br>
			部门名称:<input type="text" name="deptname" value="<%=dept.getDname()%>"/><br>
			部门位置:<input type="text" name="loc" value="<%=dept.getLoc()%>"/><br>
			<input type="submit" value="修改"/><br>
		</form>
	</body>
</html>
<%@ page import="com.zwm.oa.bean.Dept" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
	<head>
		<meta charset="utf-8">
		<title>修改部门</title>
	</head>
	<body>
		<h2>欢迎${username}</h2>
		<h1>修改部门</h1>
		<hr>
		<form action="${pageContext.request.contextPath}/dept/modify" method="post">
			部门编号:<input type="text" name="deptno" value="${dept.deptno}" readonly/><br>
			部门名称:<input type="text" name="deptname" value="${dept.dname}"/><br>
			部门位置:<input type="text" name="loc" value="${dept.loc}"/><br>
			<input type="submit" value="修改"/><br>
		</form>
	</body>
</html>

error.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>发生错误</title>
</head>
<body>
  <h1>ERROR</h1>
  <h1>ERROR</h1>
  <h1>ERROR</h1>
  <h1>ERROR</h1>
  <h1>ERROR</h1>
  <h1>ERROR</h1>
  <a href="<%=request.getContextPath()%>/index.jsp">重新登录</a>
</body>
</html>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>发生错误</title>
</head>
<body>
  <h1>ERROR</h1>
  <h1>ERROR</h1>
  <h1>ERROR</h1>
  <h1>ERROR</h1>
  <h1>ERROR</h1>
  <h1>ERROR</h1>
  <a href="${pageContext.request.contextPath}/index.jsp">重新登录</a>
</body>
</html>

index.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<!DOCTYPE html>
<html>
<head>
	<title>登录页面</title>
	<style>
		body {
			background-color: #f5f5f5;
			font-family: Arial, sans-serif;
		}

		.container {
			max-width: 400px;
			margin: 0 auto;
			padding: 20px;
			background-color: #ffffff;
			border-radius: 8px;
			box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
		}

		h2 {
			text-align: center;
			color: #333333;
		}

		.form-group {
			margin-bottom: 15px;
		}

		label {
			display: block;
			margin-bottom: 5px;
			color: #666666;
		}

		input[type="text"],
		input[type="password"] {
			width: 90%;
			padding: 10px;
			border: 1px solid #dddddd;
			border-radius: 4px;
		}

		button[type="submit"] {
			display: block;
			width: 100%;
			padding: 10px;
			background-color: #333333;
			color: #ffffff;
			border: none;
			border-radius: 4px;
			cursor: pointer;
		}

		button[type="submit"]:hover {
			background-color: #222222;
		}
	</style>
</head>
<body>
<br>
<br>
<br>
<div class="container">
	<h2>用户登录</h2>
	<form action="<%=request.getContextPath()%>/user/login" method="post">
		<!-- 用户名字段 -->
		<div class="form-group">
			<label for="username">用户名:</label>
			<input type="text" id="username" name="username" required/>
		</div>

		<!-- 密码字段 -->
		<div class="form-group">
			<label for="password">密码:</label>
			<input type="password" id="password" name="password" required/>
		</div>
		<input type="checkbox" name="f" value="1">10天内免登录
		<!-- 提交按钮 -->
		<button type="submit" value="login">登录</button>
	</form>
</div>
</body>
</html>

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<!DOCTYPE html>
<html>
<head>
	<title>登录页面</title>
	<style>
		body {
			background-color: #f5f5f5;
			font-family: Arial, sans-serif;
		}

		.container {
			max-width: 400px;
			margin: 0 auto;
			padding: 20px;
			background-color: #ffffff;
			border-radius: 8px;
			box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
		}

		h2 {
			text-align: center;
			color: #333333;
		}

		.form-group {
			margin-bottom: 15px;
		}

		label {
			display: block;
			margin-bottom: 5px;
			color: #666666;
		}

		input[type="text"],
		input[type="password"] {
			width: 90%;
			padding: 10px;
			border: 1px solid #dddddd;
			border-radius: 4px;
		}

		button[type="submit"] {
			display: block;
			width: 100%;
			padding: 10px;
			background-color: #333333;
			color: #ffffff;
			border: none;
			border-radius: 4px;
			cursor: pointer;
		}

		button[type="submit"]:hover {
			background-color: #222222;
		}
	</style>
</head>
<body>
<br>
<br>
<br>
<div class="container">
	<h2>用户登录</h2>
	<form action="${pageContext.request.contextPath}/user/login" method="post">
		<!-- 用户名字段 -->
		<div class="form-group">
			<label for="username">用户名:</label>
			<input type="text" id="username" name="username" required/>
		</div>

		<!-- 密码字段 -->
		<div class="form-group">
			<label for="password">密码:</label>
			<input type="password" id="password" name="password" required/>
		</div>
		<input type="checkbox" name="f" value="1">10天内免登录
		<!-- 提交按钮 -->
		<button type="submit" value="login">登录</button>
	</form>
</div>
</body>
</html>

list.jsp

<%@ page import="com.zwm.oa.bean.Dept" %>
<%@ page import="java.util.List" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
	<head>
		<meta charset="utf-8">
		<title>部门列表页面</title>
	</head>
	<body>
		<script>
			function del(dno){
				if(window.confirm("亲,删了不可恢复哦!")){
					document.location.href = "<%=request.getContextPath()%>/dept/delete?deptno=" + dno;
				}
			}
		</script>
		<h2>欢迎<%=session.getAttribute("username")%></h2>
		<a href="<%=request.getContextPath()%>/user/exit">[退出]</a>

		<h1 align="center">部门列表</h1>
		<hr>
		<table border="1px" align="center" width="50%">
			<tr>
				<th>编号</th>
				<th>名称</th>
				<th>位置</th>
				<th>操作</th>
			</tr>

            <%--这里返回的是一个Object,但我们已经知道返回的是List集合,所有可以进行强制转换。--%>
			<%
				List<Dept> deptList = (List<Dept>)request.getAttribute("deptList");
				int i = 0;
				for (Dept dept : deptList) {
					//System.out.println(dept);
			%>

			<tr>
				<td><%=++i%></td>
				<td><%=dept.getDeptno()%></td>
				<td><%=dept.getLoc()%></td>
				<td>
					<a href= "#" onclick="del(<%=dept.getDeptno()%>)" >删除</a>
					<a href="<%=request.getContextPath()%>/dept/detail?tag=edit&deptno=<%=dept.getDeptno()%>">修改</a>
					<a href="<%=request.getContextPath()%>/dept/detail?tag=detail&deptno=<%=dept.getDeptno()%>">详情</a>
				</td>
			</tr>

			<%
				}
			%>

		</table>
		
		<hr>
		<a href="<%=request.getContextPath()%>/add.jsp">新增部门</a>
	</body>
</html>
<%@ page import="com.zwm.oa.bean.Dept" %>
<%@ page import="java.util.List" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
	<head>
		<meta charset="utf-8">
		<title>部门列表页面</title>
	</head>
	<body>
		<script>
			function del(dno){
				if(window.confirm("亲,删了不可恢复哦!")){
					document.location.href = "<%=request.getContextPath()%>/dept/delete?deptno=" + dno;
				}
			}
		</script>
		<h2>欢迎${username}</h2>
		<a href="${pageContext.request.contextPath}/user/exit">[退出]</a>

		<h1 align="center">部门列表</h1>
		<hr>
		<table border="1px" align="center" width="50%">
			<tr>
				<th>编号</th>
				<th>名称</th>
				<th>位置</th>
				<th>操作</th>
			</tr>
			<c:forEach items="${deptList}" var="dept" varStatus="deptStatus">
				<tr>
					<td>${deptStatus.count}</td>
					<td>${dept.deptno}</td>
					<td>${dept.loc}</td>
					<td>
						<a href= "#" onclick="del(${dept.deptno})" >删除</a>
						<a href="${pageContext.request.contextPath}/dept/detail?tag=edit&deptno=${dept.deptno}">修改</a>
						<a href="${pageContext.request.contextPath}/dept/detail?tag=detail&deptno=${dept.deptno}">详情</a>
					</td>
				</tr>
			</c:forEach>

		</table>
		
		<hr>
		<a href="${pageContext.request.contextPath}/add.jsp">新增部门</a>
	</body>
</html>

EL(Expression Language)表达式和JSTL(JavaServer Pages Standard Tag Library)在 Java Web 开发中使用,可以简化和增强在 JSP 页面中对数据的操作和展示。

进一步优化:

1. base标签

在jsp代码中,大量出现${pageContext.request.contextPath}代码段,如何简化?

在前端HTML代码中,有一个标签,叫做base标签,这个标签可以设置整个网页的基础路径。

  • 这是Java的语法,也不是JSP的语法。是HTML中的一个语法。HTML中的一个标签。通常出现在head标签中。

  • < base href="http://localhost:8080/oa/">
    
  • 在当前页面中,凡是路径没有以“/”开始的,都会自动将base中的路径添加到这些路径之前。

    •  < a href="ab/def"></ a>
      

      等同于:

    • < a href="http://localhost:8080/oa/ab/def"></ a>
      
  • 需要注意:在JS代码中的路径,保险起见,最好不要依赖base标签。JS代码中的路径最好写上全路径。

< base href="http://localhost:8080/oa/">是写死的,一般不这样写。
写成动态获取:
<base href="${pageContext.request.scheme}://${pageContext.request.serverName}:${pageContext.request.serverPort}${pageContext.request.contextPath}/">





标签:EL,JavaWeb,color,border,dept,部门,jsp,ERROR,Servlet
From: https://www.cnblogs.com/LJY-YSWZ/p/17603029.html

相关文章

  • 03 ListModelSerializer组件
    ListModelSerializer模块自定义反序列化字段#一些只参与反序列化的字段,但是不是与数据库关联的#在序列化类中规定,并在校验字段时从校验的参数字典中剔除classPublishModelSerializer(serializers.ModelSerializer):#自定义不入库的反序列化字段re_name=se......
  • 关于菜鸡学习RHEL8的一些小笔记--->stratis和vdo
    #注:stratis和vdo目前都是属于redhat的预览技术,并没有实际投入到生产环境stratis精简卷(适用于海量应用场景,只需关注精简池容量,无需去管文件系统):stratis(redhat8的新功能)会吧磁盘放在一个精简配置的共享池子里面(精简存储池),stratis文件系统也是没有固定的大小,也不会提前分配没有......
  • el-transfer
     <template><divclass="p-box"><el-transferclass="new-el-transfer"filterablefilter-placeholder="请输入组织名称"v-model="value":data="dataListzz":ti......
  • 浅谈-Servlet
    在JavaWeb中,Servlet是用于处理客户端请求和生成响应的Java类。它是JavaWeb开发的核心组件之一。Servlet运行在Web服务器中,可以接收来自客户端(通常是浏览器)的请求,进行处理,并生成响应返回给客户端。Servlet的主要功能包括:接收请求:Servlet可以接收客户端发送的HTTP......
  • delete_by_query删除数据(python)
     fromelasticsearchimportElasticsearchimportos,json,urllib,datetime,shutil,random,uuidimporttimeimportrandomfromelasticsearchimporthelpersfromrandomimportchoiceif__name__=='__main__':print("开始时间:"+time.s......
  • shell 8.2
    特殊变量:$0获取脚本文件名,以及脚本路径$n获取shell的第n个参数,n在1~9之间$#获取参数的总个数$*获取shell脚本的所有参数(接受整体字符串)$@获取shell脚本的所有参数(接受单个字符串)一些语法:-ne不等于 ......
  • C# 解决导出Excel长数字变成10次幂
    在做项目的时候遇到一个bug,当编号(仅针对纯数字)长度达到一定长度,比如超过11位之后,导出Excel后就转换成了10的幂次方。这是Excel特有的转换,而且当数字的位数达到15,以后的数字就会全部转化成0,造成精度的缺失。这显然是不符合要求的。 原始的赋值代码是这样的。dr["编号"]......
  • 恶意软件分类——MalwareLabel
    MalwareLabelVocab-1.0MAECVOCABULARIESSCHEMAThe MalwareLabelVocab-1.0 isthedefaultMAECVocabularyforcommonmalwarelabels.VocabularyItemsItemDescriptionadwareThe'adware'valuespecifiesanysoftwarethatisfundedbyadvertising.Somead......
  • 130.hello.c 程序的编译过程
    130.hello.c程序的编译过程以下是一个hello.c程序:#include<stdio.h>intmain(){printf("hello,world\n");return0;}在Unix系统上,由编译器把源文件转换为目标文件。gcc-ohellohello.c这个过程大致如下:![img](D:\BaiduSyncdisk\C++\笔记图片\130.h......
  • MSSQL提权之xp_cmdshell、SP_OACreate、沙盒提权
    在xp_cmdshell被删除或者出错情况下,可以充分利用SP_OACreate进行提权 首先 EXECsp_configure'showadvancedoptions',1;  RECONFIGUREWITHOVERRIDE;  EXECsp_configure'OleAutomationProcedures',1;  RECONFIGUREWITHOVERRIDE;  EXECsp_configure'showad......