JSP learning notes II. JSP Script & case implementation & defect analysis

Previously: JSP learning notes | I. understanding of JSP principle

JSP scripts are used to define java code within JSP pages. In many introductory cases, the Java code defined on the JSP page is JSP script.

JSP script classification

JSP scripts have the following three categories:

<%...% >: the content will be put directly into_ In the jspService() method
<% =...% >: the content will be put into out.print() as the parameter of out.print()
<%!…%>: The content will be placed in_ Outside the jspService() method, it is directly contained by the class

Code demonstration:

Write in hello.jsp

<%
    System.out.println("hello,jsp~");
    int i = 3;
%>

After accessing hello.jsp through the browser, view the converted hello_jsp.java file, i variable is defined in_ In the jspService() method

Write in hello.jsp

<%="hello"%>
<%=i%>

After accessing hello.jsp through the browser, view the converted hello_jsp.java file. The contents of the script are placed in out.print() as parameters

Write in hello.jsp

<%!
    void  show(){}
	String name = "zhangsan";
%>

After accessing hello.jsp through the browser, view the converted hello_jsp.java file, the contents of the script are placed in the member location

case

Using JSP script to display brand data

Note: in this case, the data is not queried from the database, but written on the JSP page

Case realization

Write the Brand.java file and place it under the com.riotian.pojo package of the project

/**
 * Brand entity class
 */

public class Brand {
    // id primary key
    private Integer id;
    // Brand name
    private String brandName;
    // Enterprise name
    private String companyName;
    // sort field
    private Integer ordered;

    @Override
    public String toString() {
        return "Brand{" +
                "id=" + id +
                ", brandName='" + brandName + '\'' +
                ", companyName='" + companyName + '\'' +
                ", ordered=" + ordered +
                ", description='" + description + '\'' +
                ", status=" + status +
                '}';
    }

    public Integer getId() {
        return id;
    }

    public void setId(Integer id) {
        this.id = id;
    }

    public String getBrandName() {
        return brandName;
    }

    public void setBrandName(String brandName) {
        this.brandName = brandName;
    }

    public String getCompanyName() {
        return companyName;
    }

    public void setCompanyName(String companyName) {
        this.companyName = companyName;
    }

    public Integer getOrdered() {
        return ordered;
    }

    public void setOrdered(Integer ordered) {
        this.ordered = ordered;
    }

    public String getDescription() {
        return description;
    }

    public void setDescription(String description) {
        this.description = description;
    }

    public Integer getStatus() {
        return status;
    }

    public void setStatus(Integer status) {
        this.status = status;
    }

    // Description information
    private String description;
    // Status: 0: Disabled 1: enabled
    private Integer status;

    public Brand() {
    }

    public Brand(Integer id, String brandName, String companyName, String description) {
        this.id = id;
        this.brandName = brandName;
        this.companyName = companyName;
        this.description = description;
    }

    public Brand(Integer id, String brandName, String companyName, Integer ordered, String description, Integer status) {
        this.id = id;
        this.brandName = brandName;
        this.companyName = companyName;
        this.ordered = ordered;
        this.description = description;
        this.status = status;
    }
}

Create brand.jsp in the webapp of the project and copy the following content. The content of brand.jsp is as follows

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<input type="button" value="newly added"><br>
<hr>
    <table border="1" cellspacing="0" width="800">
        <tr>
            <th>Serial number</th>
            <th>Brand name</th>
            <th>Enterprise name</th>
            <th>sort</th>
            <th>Brand introduction</th>
            <th>state</th>
            <th>operation</th>

        </tr>
        <tr align="center">
            <td>1</td>
            <td>Three squirrels</td>
            <td>Three squirrels</td>
            <td>100</td>
            <td>Three squirrels, delicious but not hot</td>
            <td>Enable</td>
            <td><a href="#">modify</a> <a href="#"> delete</a></td>
        </tr>

        <tr align="center">
            <td>2</td>
            <td>Uniqlo</td>
            <td>Uniqlo</td>
            <td>10</td>
            <td>UNIQLO suits life</td>
            <td>Disable</td>

            <td><a href="#">modify</a> <a href="#"> delete</a></td>
        </tr>

        <tr align="center">
            <td>3</td>
            <td>millet</td>
            <td>Xiaomi Technology Co., Ltd</td>
            <td>1000</td>
            <td>Born with a fever</td>
            <td>Enable</td>

            <td><a href="#">modify</a> <a href="#"> delete</a></td>
        </tr>
    </table>
</body>
</html>

Now the data in the page is false data.

Prepare some data in brand.jsp. Note: the classes here need to import packages

<%
    // query data base
    List<Brand> brands = new ArrayList<Brand>();
    brands.add(new Brand(1,"Three squirrels","Three squirrels",100,"Three squirrels, delicious but not hot",1));
    brands.add(new Brand(2,"Uniqlo","Uniqlo",200,"UNIQLO suits life",0));
    brands.add(new Brand(3,"millet","Xiaomi Technology Co., Ltd",1000,"Born with a fever",1));
%>

Change the data in the table tag in the brand.jsp page to dynamic

<table border="1" cellspacing="0" width="800">
    <tr>
        <th>Serial number</th>
        <th>Brand name</th>
        <th>Enterprise name</th>
        <th>sort</th>
        <th>Brand introduction</th>
        <th>state</th>
        <th>operation</th>

    </tr>
    
    <%
     for (int i = 0; i < brands.size(); i++) {
         //Gets each Brand object in the collection
         Brand brand = brands.get(i);
     }
    %>
    <tr align="center">
        <td>1</td>
        <td>Three squirrels</td>
        <td>Three squirrels</td>
        <td>100</td>
        <td>Three squirrels, delicious but not hot</td>
        <td>Enable</td>
        <td><a href="#">modify</a> <a href="#"> delete</a></td>
    </tr>
</table>

The above for loop needs to wrap the tr tag to achieve the effect of the loop. The code is improved to

<table border="1" cellspacing="0" width="800">
    <tr>
        <th>Serial number</th>
        <th>Brand name</th>
        <th>Enterprise name</th>
        <th>sort</th>
        <th>Brand introduction</th>
        <th>state</th>
        <th>operation</th>

    </tr>
    
    <%
     for (int i = 0; i < brands.size(); i++) {
         //Gets each Brand object in the collection
         Brand brand = brands.get(i);
    %>
    	 <tr align="center">
            <td>1</td>
            <td>Three squirrels</td>
            <td>Three squirrels</td>
            <td>100</td>
            <td>Three squirrels, delicious but not hot</td>
            <td>Enable</td>
            <td><a href="#">modify</a> <a href="#"> delete</a></td>
        </tr>
    <%
     }
    %>
   
</table>

Note: <%% > the inside is written in Java code, while the outside is written in HTML tags

The data in the td tag in the above code needs to be dynamic, so it needs to be improved

<table border="1" cellspacing="0" width="800">
    <tr>
        <th>Serial number</th>
        <th>Brand name</th>
        <th>Enterprise name</th>
        <th>sort</th>
        <th>Brand introduction</th>
        <th>state</th>
        <th>operation</th>

    </tr>
    
    <%
     for (int i = 0; i < brands.size(); i++) {
         //Gets each Brand object in the collection
         Brand brand = brands.get(i);
    %>
    	 <tr align="center">
            <td><%=brand.getId()%></td>
            <td><%=brand.getBrandName()%></td>
            <td><%=brand.getCompanyName()%></td>
            <td><%=brand.getOrdered()%></td>
            <td><%=brand.getDescription()%></td>
            <td><%=brand.getStatus() == 1 ? "Enable":"Disable"%></td>
            <td><a href="#">modify</a> <a href="#"> delete</a></td>
        </tr>
    <%
     }
    %>
   
</table>

Complete code

<%--
  Created by IntelliJ IDEA.
  User: 64129
  Date: 2021/12/5
  Time: 18:04
--%>

<%@ page import="com.riotian.pojo.Brand" %>
<%@ page import="java.util.List" %>
<%@ page import="java.util.ArrayList" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    // query data base
    List<Brand> brands = new ArrayList<Brand>();
    brands.add(new Brand(1, "Three squirrels", "Three squirrels", 100, "Three squirrels, delicious but not hot", 1));
    brands.add(new Brand(2, "Uniqlo", "Uniqlo", 200, "UNIQLO suits life", 0));
    brands.add(new Brand(3, "millet", "Xiaomi Technology Co., Ltd", 1000, "Born with a fever", 1));

%>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Brand.jsp</title>
</head>
<body>


<input type="button" value="newly added"><br>
<hr>
<table border="1" cellspacing="0" width="800">
    <tr>
        <th>Serial number</th>
        <th>Brand name</th>
        <th>Enterprise name</th>
        <th>sort</th>
        <th>Brand introduction</th>
        <th>state</th>
        <th>operation</th>

    </tr>
    <%
        for (int i = 0; i < brands.size(); i++) {
            //Gets each Brand object in the collection
            Brand brand = brands.get(i);
    %>
    <tr align="center">
        <td><%=brand.getId()%></td>
        <td><%=brand.getBrandName()%></td>
        <td><%=brand.getCompanyName()%></td>
        <td><%=brand.getOrdered()%></td>
        <td><%=brand.getDescription()%></td>
        <td><%=brand.getStatus() == 1 ? "Enable":"Disable"%></td>
        <td><a href="#">modify</a> <a href="#"> delete</a></td>
    </tr>
    <%
        }
    %>
</table>
</body>
</html>

Run test

Enter in the browser address bar http://localhost:8080/jsp-demo/brand.jsp, the page display effect is as follows

JSP disadvantages

Through the above case, we can see many shortcomings of JSP.

Because both HTML tags and Java codes can be defined in JSP pages, the following problems are caused:

Writing trouble: especially complex pages

Write both HTML tags and Java code
Reading trouble

I believe it will take a long time to sort out the code of the above case when you look at this code later
High complexity: the operation needs to depend on various environments, JRE, JSP container, JavaEE
Occupy memory and disk: JSP will automatically generate. java and. class files to occupy disk, and run. class files to occupy memory
Debugging difficulty: after an error, you need to find the automatically generated. java file for debugging
It is not conducive to teamwork: front-end personnel do not know Java, and back-end personnel do not know HTML

If the page layout changes, the front-end engineer will modify the static page, and then hand it to the back-end engineer, who will change the page into a JSP page

Due to the above problems, JSP has gradually withdrawn from the historical stage. In the future, it will be replaced by HTML + Ajax. AJAX is the technology we will focus on later. After this technology, the front-end engineer is responsible for the front-end page development, while the back-end engineer is only responsible for the front-end code development. Let's give a brief description of the development of the technology

The first stage: using servlet s not only implements logic coding, but also splices pages. We have also touched this mode before
The second stage: with the development of technology, JSP appeared. People found that JSP is much more convenient to use than Servlet, but it is still necessary to nest Java code in JSP, which is not conducive to later maintenance
The third stage: use Servlet for logic code development, and use JSP for data display
Stage 4: use servlet to develop back-end logic code and HTML to display data. There is a problem. Html is a static page. How to display dynamic data? This is the role of ajax.

Since JSP has gradually withdrawn from the historical stage, why should we learn jsp? There are two reasons:

Some companies may still use JSP for some old projects, so we must move JSP
If we don't go through these complex processes, we can't reflect the simplicity of development in the later stage

Posted on Sun, 05 Dec 2021 15:24:04 -0500 by big_mumma

Programmer Help

JSP learning notes II. JSP Script & case implementation & defect analysis

JSP script classification

Code demonstration:

case

Case realization

Complete code

Run test

JSP disadvantages

Hot Tags