jsp缺点描述:
由于jsp当中即定义HTML标签 又定义java代码,因此出现了如上问题
因此我们学习EL表达式用来简化jsp页面当中的java代码
一、EL表达式
代码演示如下:
假设我们随便在request域当中封装一点数据演示
数据准备:
数据封装到Brand对象属性到List集合中往request域当中添加数据:
// 1.准备数据 (往request域中准备一点数据)
List<Brand> brands =new ArrayList<>();
brands.add(new Brand(1,"三只松鼠","三只松鼠",100,"三只松鼠,好吃不上火",1));
brands.add(new Brand(2,"优衣库","优衣库",200,"优衣库,服适人生",0));
brands.add(new Brand(3,"小米","小米科技有限公司",1000,"为发烧而生",1));
创建demo1资源路径数据:
注意:只要是页面就不用写路径了 因为页面的名就相当于路径
package com.itheima.web;
import com.itheima.pojo.Brand;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.util.ArrayList;
import java.util.List;
@WebServlet("/demo1")
public class ServletDemo1 extends HttpServlet {
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// 1.准备数据 (往request域中准备一点数据)
List<Brand> brands =new ArrayList<>();
brands.add(new Brand(1,"三只松鼠","三只松鼠",100,"三只松鼠,好吃不上火",1));
brands.add(new Brand(2,"优衣库","优衣库",200,"优衣库,服适人生",0));
brands.add(new Brand(3,"小米","小米科技有限公司",1000,"为发烧而生",1));
// 2.储存到request域当中 (把集合中封装的数据储存到req域当中)
request.setAttribute("bra",brands);
// 3.把数据请求转发到 el-demo.jsp 路径下 (el-demo.jsp 也相当于路径 毕竟是页面)
request.getRequestDispatcher("/el-demo.jsp").forward(request,response);
}
@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
this.doGet(request, response);
}
}
(把brands集合数据封装到req域当中,req域当中是以key,value格式Map集合储存数据的,并且value是数组格式 上面是以key为bra的形式把brands储存到req域当中的)
创建el-demo.jsp: 演示出了EL表达式简化了下面JSP页面的java代码 (不用通过key获取req域当中的集合然后再通过遍历出数据弹给用户的java代码了 直接用EL表达式简化)
通过访问demo1的路径来演示EL正则表达式的作用:
二、JSTL
步骤:
1、坐标:
<dependency>
<groupId>jstl</groupId>
<artifactId>jstl</artifactId>
<version>1.2</version>
</dependency>
<dependency>
<groupId>taglibs</groupId>
<artifactId>standard</artifactId>
<version>1.1.2</version>
</dependency>
2、创建jsp页面并引入jstl标签库
使用<c:if>标签代码演示如下:
c:if 来完成逻辑判断, 替换java中的 if .... else
也就是说 如果test为”true“就会执行该对应的标签里面的内容 如果为”false“就不执行该对应的标签中的内容
以后我们会用动态的代替true或false
开启服务器访问该jsp:(只执行为true的标签中的内容)
这里的true和false我们可以设置为动态的方式然后进行test演示如下:
通过访问demo1路径下的资源 在demo1资源当中请求转发到jstl-if.jsp网页当中:
使用<c:forEach>标签代码演示:(记得看上面的步骤引标签库)
代码演示如下:
demo1路径下的资源:
转发到jstl-foreach.jsp路径下资源:
访问demo1路径下资源 然后请求转发到jstl-foreach.jsp:
jsp页面中我们加上表格形式 (也就是前端把遍历的数据添加个表格):
<%--
Created by IntelliJ IDEA.
User: 刘文君
Date: 2022/5/17
Time: 22:16
To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <%-- 引入标签库 --%>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<input type="button" value="新增" id="add"><br>
<hr>
<table border="1" cellspacing="0" width="80%">
<tr>
<th>序号</th>
<th>品牌名称</th>
<th>企业名称</th>
<th>排序</th>
<th>品牌介绍</th>
<th>状态</th>
<th>操作</th>
</tr>
<c:forEach items="${bra}" var="brand" varStatus="status">
<tr align="center">
<%--<td>${brand.id}</td>--%>
<td>${status.count}</td>
<td>${brand.brandName}</td>
<td>${brand.companyName}</td>
<td>${brand.ordered}</td>
<td>${brand.description}</td>
<td>${brand.status}</td>
<td><a href="/brand-demo/selectByIdServlet?id=${brand.id}">修改</a> <a href="#">删除</a></td>
</tr>
</c:forEach>
</table>
<script>
document.getElementById("add").onclick = function (){
location.href = "/brand-demo/addBrand.jsp";
}
</script>
</body>
</html>
细节1:我们如果想把状态中的1改为启用 0改为禁止,我们需要如何修改代码:
细节2:我们id序号一般不返回给客户端 (因为我们做增删改查的时候有时候删掉该行 但是id也是增长的) 因此我们可以把id改成序号展示给用户:
因此需要用到 varStatus:遍历状态对象
再演示最后一个 有开始数属性 和 步长属性.....:
加上超链接后,就相当于我们的搜索页码: