JavaWeb基础系列（六）El和Jstl

男娘i 2021-09-26 23:54 312阅读 0赞

# 一、EL技术 #

## 1.1、EL表达式概述 ##

EL（Express Lanuage）表达式可以嵌入在jsp页面内部，减少jsp脚本的编写，EL出现的目的是要替代jsp页面中脚本的编写。

## 1.2、EL从域中取出数据 ##

EL最主要的作用是获得四大域中的数据，格式`${EL表达式}`  
EL获得pageContext域中的值：`$(pageContextScope.key);`  
EL获得request域中的值：`$(requestScope.key);`  
EL获得session域中的值：`$(sessionScope.key);`  
EL获得application域中的值：`$(applicationScope.key);`  
EL从四个域中获得某个值$(key);  
—同样是依次从pageContext域，request域，session域，application域中获取属性，在某个域中获取后将不在向后寻找。

## 1.3、EL的内置对象 ##

pageScope,requestScope,sessionScope,applicationScope —- 获取JSP中域中的数据  
param,paramValues - 接收参数.  
header,headerValues - 获取请求头信息  
initParam - 获取全局初始化参数  
cookie - WEB开发中cookie  
pageContext - WEB开发中的pageContext.  
**$(pageContext.request.contextPath)  
相当于  
<%=pageContext.getRequest().getContextPath%>  
获得WEB应用的名称**

# 二、JSTL技术 #

JSTL（JSP Standard Tag Library)，JSP标准标签库，可以嵌入在jsp页面中使用标签的形式完成业务逻辑等功能。jstl出现的目的同el一样也是要提到jsp页面中的脚本代码。JSTL标准标准标签库有5个子库，但随着发展，目前常使用的是他的核心库。  
![这里写图片描述][70]

## JSTL核心库的常用标签 ##

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
    <html>
    <head>
        <title>Title</title>
    </head>
    <body>
        <% request.setAttribute("count",10); %>
        
        <c:if test="${count==0}">
            xxx
        </c:if>
        <c:if test="${count!=10}">
            yyy
        </c:if>
    </body>
    </html>

运行结果：xxx

<c:forEach begin="0" end="5" var="i">
        ${i}<br>
    </c:forEach>

<%@ page import="java.util.ArrayList" %>
    <%@ page import="java.util.List" %>
    <%@ page import="com.naruto.domain.User" %>
    <%@ page import="java.util.Map" %>
    <%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
    <html>
    <head>
        <title>Title</title>
    </head>
    <body>
        <% //模拟List<String> strList List<String> strList = new ArrayList<String>(); strList.add("itcast"); strList.add("itheima"); strList.add("boxuegu"); strList.add("shandingyu"); request.setAttribute("strList", strList); //遍历List<User>的值 List<User> userList = new ArrayList<User>(); User user1 = new User(); user1.setName("lisi"); user1.setPassword("123"); userList.add(user1); User user2 = new User(); user2.setName("wangwu"); user2.setPassword("123"); userList.add(user2); application.setAttribute("userList", userList); //遍历Map<String,String>的值 Map<String,String> strMap = new HashMap<String,String>(); strMap.put("name", "lucy"); strMap.put("age", "18"); strMap.put("addr", "西三旗"); strMap.put("email", "licy@itcast.cn"); session.setAttribute("strMap", strMap); //遍历Map<String,User>的值 Map<String,User> userMap = new HashMap<String,User>(); userMap.put("user1", user1); userMap.put("user2", user2); request.setAttribute("userMap", userMap); %>
    
        <h1>取出strList的数据</h1>
        <c:forEach items="${strList }" var="str">
            ${str }<br/>
        </c:forEach>
    
        <h1>取出userList的数据</h1>
        <c:forEach items="${userList}" var="user">
            user的name：${user.name }------user的password：${user.password }<br/>
        </c:forEach>
    
        <h1>取出strMap的数据</h1>
        <c:forEach items="${strMap }" var="entry">
            ${entry.key }====${entry.value }<br/>
        </c:forEach>
    
        <h1>取出userMap的数据</h1>
        <c:forEach items="${userMap }" var="entry">
            ${entry.key }:${entry.value.name }--${entry.value.password }<br/>
        </c:forEach>
    </body>
    </html>

运行结果：  
![这里写图片描述][70 1]

# 三、MVC和三层架构 #

什么是模式？  
mode1模式：  
    技术组成：jsp+javaBean  
    弊端：随着业务的复杂性导致jsp页面比较混乱  
mode2模式：jsp+servlet+javaBean  
    mode2的优点：开发中，使用各个技术擅长的方面  
    servlet擅长处理java业务代码  
    jsp擅长页面的显示  
MVC：  
    M：Model–模型 javaBean：封装数据  
    V：View–视图 jsp：单纯进行页面的显示  
    C：Controller–控制器 Servlet：获取数据–业务处理–传递数据  
![这里写图片描述][70 2]  
JavaEE三层架构：  
web层：与客户端交互  
service：复杂业务的处理  
dao层：与数据库进行交互  
![这里写图片描述][70 3]

# 四、使用三层架构完成商品列表显示 #

Web层：

@WebServlet(name = "ProductList",
            urlPatterns = {
       "/ProductList"})
    public class ProductListServlet extends HttpServlet { 
        protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
            doGet(request,response);
        }
        protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
            //传递请求到service层
            ProductService service = new ProductService();
            List<Product> productList = null;
            try {
                productList = service.findAllProduct();
            } catch (SQLException e) {
                e.printStackTrace();
            }
            //全部的商品的数据已经准备好了，转发给jsp进行数据展示
            request.setAttribute("productList", productList);
            request.getRequestDispatcher("/product_list.jsp").forward(request, response);
        }
    }

Service层：

public class ProductService {
        public List<Product> findAllProduct() throws SQLException {
            ProductDao dao = new ProductDao();
            List<Product> productList = dao.findAllProduct();
            return productList;
        }
    }

Dao层：

public class ProductDao {
        public List<Product> findAllProduct() throws SQLException {
            //准备所有商品的数据 ---- List<Product>
            QueryRunner runner = new QueryRunner(DataSourceUtils.getDataSource());
            String sql = "select * from product";
            List<Product> productList = null;
            productList = runner.query(sql, new BeanListHandler<Product>(Product.class));
            return  productList;
        }
    }

View：

<c:forEach items="${productList }" var="product">
                <div class="col-md-2" style="height:250px">
                    <a href="product_info.htm">
                        <img src="${pageContext.request.contextPath }/${product.pimage }" width="170" height="170" style="display: inline-block;">
                    </a>
                    <p>
                        <a href="product_info.html" style='color: green'>${product.pname }</a>
                    </p>
                    <p>
                        <font color="#FF0000">商城价：¥${product.shop_price }</font>
                    </p>
                </div>
     </c:forEach>

运行结果：  
![这里写图片描述][70 4]

[70]: /images/20210923/824e4aeb1bf54e938524057bf2b265d8.png
[70 1]: /images/20210923/3aed72b2485147bd9f067fc4d83e13b2.png
[70 2]: /images/20210923/579ee72280e44d97a6656841a4814e92.png
[70 3]: /images/20210923/c00c9069532b4d4ebae94dde3b8dadb4.png
[70 4]: /images/20210923/1faec01a729e47268baa96f4d0ca0403.png