一、问题引入
在做完分页功能之后,页面的html代码和java代码全混合到一起了,代码比较乱。
- 代码结构混乱
- 脚本与html混合,容易出错
- 代码不易于维护
可以使用EL表达式来优化程序代码,增加程序可读性。
二、EL简介
2.1EL语法

2.2EL功能

2.3EL访问作用域

上面第三行写错了,后面不要那个news。
在用EL表达式之前,需要先将变量放到相应的作用域里面,也就是上面图片的第一行,这样才能使用EL表达式。
如果不写作用域的话,会从小到大依次去取值,比如上面要是只写个news的话,则会先去页面作用域里面找,然后是请求作用域,会话作用域,程序作用域,直至找到为止。
三、示例
修改前素材:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@page import="com.kgc.pojo.News"%>
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@include file="../common/common.jsp" %>
<html>
<head>
<link href="<%=request.getContextPath() %>/css/common.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="<%=request.getContextPath() %>/ckeditor/ckeditor.js"> </script>
</head>
<body>
<%
int id = Integer.parseInt(request.getParameter("id"));
News news = newsService.getNewsById(id);
%>
<div class="main-content-right">
<div class="main-text-box">
<div class="main-text-box-tbg">
<div class="main-text-box-bbg">
<div class="article-box">
<!--新闻的标题-->
<h1><%=news.getTitle() %></h1>
<div class="source-bar">发布者:<%=news.getAuthor() %> 分类:新闻信息 更新时间:<%=news.getCreateDate() %></div>
<div class="article-content">
<span class="article-summary"><b>摘要:<%=news.getSummary() %></b></span>
<%
if(news.getPicPath() == null || news.getPicPath().equals("")){
%>
新闻图片:暂无<br/>
<%}else{ %>
<img src="<%=request.getContextPath() %>/upload/<%=news.getPicPath() %>"/><br/>
<%}%>
<%=news.getContent() %>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
修改后的代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@page import="com.kgc.pojo.News"%>
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@include file="../common/common.jsp" %>
<html>
<head>
<link href="<%=request.getContextPath() %>/css/common.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="<%=request.getContextPath() %>/ckeditor/ckeditor.js"> </script>
</head>
<body>
传递过来的新闻ID:${param.id }
<%
int id = Integer.parseInt(request.getParameter("id"));
News news = newsService.getNewsById(id);
request.setAttribute("news", news);
%>
<div class="main-content-right">
<div class="main-text-box">
<div class="main-text-box-tbg">
<div class="main-text-box-bbg">
<div class="article-box">
<!--新闻的标题-->
<h1>${news.title }</h1>
<div class="source-bar">发布者:${news.author } 分类:新闻信息 更新时间:${news.createDate }</div>
<div class="article-content">
<span class="article-summary"><b>摘要:${news.summary }</b></span>
<%
if(news.getPicPath() == null || news.getPicPath().equals("")){
%>
新闻图片:暂无<br/>
<%}else{ %>
<img src="<%=request.getContextPath() %>/upload/<%=news.getPicPath() %>"/><br/>
<%}%>
${news.content }
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
EL常用的两种表达方式:
1、获取request的参数,方式如下:
传递过来的新闻ID:${param.id }
2、在页面中获取设置的变量的参数:
<h1>${news.title }</h1>
<div class="source-bar">发布者:${news.author } 分类:新闻信息 更新时间:${news.createDate }</div>
四、删除新闻
newsDetailList.jsp页面:
<%@page import="com.kgc.util.PageSupport"%>
<%@page import="com.kgc.pojo.News"%>
<%@page import="java.util.List"%>
<%@page import="com.kgc.service.impl.NewsServiceImpl"%>
<%@page import="com.kgc.service.NewsService"%>
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<%--动态包含无法使用,页面报错,newsService无法使用 <jsp:include page="../common/common.jsp" /> --%>
<%@include file="../common/common.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>无标题文档</title>
<style type="text/css">
<!--
-->
</style>
<script>
function addNews(){
window.location="newsDetailCreateSimple.jsp";
}
function page_nav(frm,num){
frm.pageIndex.value=num;
frm.submit();
}
function jump_to(frm,pageno){
//var regexp=/^\d+$/;
var regexp=/^[1-9]\d*$/;
var totalPage = document.getElementById("totalPage").value;
if(!regexp.test(pageno)){
alert("请输入 正确的数字!");
return false;
}else if((pageno-totalPage) > 0){
alert("总页码一共"+totalPage+"页,请输入正确的页码!");
return false;
}else{
page_nav(frm,pageno);
}
}
// 下面这段代码不用事件触发,只要进了这个脚本就会执行的
var flag = ${param.flag};
if (flag != null && flag != "" && undefined != flag){
if (flag == "success") {
alert("删除成功");
} else {
alert("删除失败");
}
}
</script>
</head>
<body>
<!--主体-->
<div class="main-content-right">
<!--即时新闻-->
<div class="main-text-box">
<div class="main-text-box-tbg">
<div class="main-text-box-bbg">
<form name ="searchForm" id="searchForm" action="/news/jsp/admin/newsDetailList.jsp" method="post">
<div>
新闻分类:
<select name="categoryId">
<option value="0">全部</option>
<option value='1' >国内</option>
<option value='2' >国际</option>
<option value='3' >娱乐</option>
<option value='4' >军事</option>
<option value='5' >财经</option>
<option value='6' >天气</option>
</select>
新闻标题<input type="text" name="title" id="title" value=''/>
<button type="submit" class="page-btn">GO</button>
<button type="button" onclick="addNews();" class="page-btn">增加</button>
<input type="hidden" name="pageIndex" value="1"/>
</div>
</form>
<table cellpadding="1" cellspacing="1" class="admin-list">
<thead >
<tr class="admin-list-head">
<th>新闻标题</th>
<th>作者</th>
<th>时间</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<%
//获取当前页码
String currntPage=request.getParameter("pageIndex");
if(currntPage==null)
currntPage="1";
int pageIndex=Integer.parseInt(currntPage);
//获取新闻记录总数量
int totalCount=newsService.getTotalCount();
//每页显示记录数
int pageSize=2;
/*获取总页数*/
PageSupport pages=new PageSupport();
pages.setCurrentPageNo(pageIndex);
pages.setPageSize(pageSize);
pages.setTotalCount(totalCount);
int totalPage=pages.getTotalPageCount();
//控制首页和末页
if(pageIndex<1)
pageIndex=1;
else if(pageIndex>totalPage)
pageIndex=totalPage;
//每页显示的新闻列表
List<News> newsList=newsService.getPageNewsList(pageIndex, pageSize);
int i=0;
for(News news:newsList){
i++;
%>
<input type="hidden" id="totalPage" value="<%=totalPage%>"/>
<tr <%if(i%2==0){ %>class="admin-list-td-h2"<%} %>>
<td><a href='newsDetailView.jsp?id=<%=news.getId()%>'><%=news.getTitle() %></a></td>
<td><%=news.getAuthor() %></td>
<td><%=news.getCreateDate() %></td>
<td><a href='adminNewsCreate.jsp?id=2'>修改</a>
<a href="javascript:if(confirm('确认是否删除此新闻?')) location='adminNewsDel.jsp?id=<%=news.getId() %>'">删除</a>
</td>
</tr>
<%} %>
</tbody>
</table>
<div class="page-bar">
<ul class="page-num-ul clearfix">
<li>共<%=totalCount %>条记录 <%=pageIndex %>/<%=totalPage %>页</li>
<%
if(pageIndex>1){
%>
<a href="javaScript:page_nav(document.forms[0],1)">首页</a>
<a href="javaScript:page_nav(document.forms[0],<%=pageIndex-1%>)">上一页</a>
<%
}if(pageIndex<totalPage){
%>
<a href="javaScript:page_nav(document.forms[0],<%=pageIndex+1%>)">下一页</a>
<a href="javaScript:page_nav(document.forms[0],<%=totalPage%>)">最后一页</a>
<%
}
%>
</ul>
<span class="page-go-form"><label>跳转至</label>
<input type="text" name="inputPage" id="inputPage" class="page-key" />页
<button type="button" class="page-btn" onClick='jump_to(document.forms[0],document.getElementById("inputPage").value)'>GO</button>
</span>
</div>
</div>
</div>
</div>
</div>
</body></html>
adminNewsDel.jsp页面:
<%@page import="com.kgc.pojo.News"%>
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<%@include file="../common/common.jsp" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'MyJsp.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
</head>
<body>
<%
// 该页面为删除新闻的处理页面
// (1) 获取删除新闻的id
// (2) 调用后台方法删除对应id的新闻
int id = Integer.parseInt(request.getParameter("id"));
News news = new News();
news.setId(id);
String flag = "failed";
if (newsService.delete(news)){
flag = "success";
}
response.sendRedirect("newsDetailList.jsp?flag=" + flag);
%>
</body>
</html>
网友评论