2021-07-04

JavaWebjwd
提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档

---

前言

提示：这里可以添加本文要记录的大概内容：
例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的基础内容。

---

提示：以下是本篇文章正文内容，下面案例可供参考

一、创建javaweb步骤

示例：pandas 是基于NumPy 的一种工具，该工具是为了解决数据分析任务而创建的。

二、JavaWeb的逐步实现

1.Impl包下的StudentDaoImpl类

package com.jsj.dao.Impl;

import com.jsj.dao.StudentDao;
import com.jsj.entities.Student;

import java.sql.*;
import java.util.ArrayList;
import java.util.List;

public class StudentDaoImpl implements StudentDao {
    public Connection getConnection()  {
        try {
            Class.forName("com.mysql.jdbc.Driver");
            String url="jdbc:mysql://localhost:3306/student";
            String user="root";
            String pwd="1234";
            return DriverManager.getConnection(url, user, pwd);
        } catch (Exception e) {
            e.printStackTrace();
        }
        return  null;
    }

    @Override
    public void saveStudent(Student student) {
        Connection connection= getConnection();
        try {
            connection.setAutoCommit(false);
            String sql="insert into student(name,dept,age)values(?,?,?)";
            PreparedStatement ps = connection.prepareStatement(sql);
            ps.setString(1,student.getName());
            ps.setString(2,student.getDept());
            ps.setInt(3,student.getAge());
            ps.executeUpdate();
            connection.commit();

        } catch (SQLException e) {
            try {
                connection.rollback();
            } catch (SQLException ex) {
                ex.printStackTrace();
            }
            e.printStackTrace();
        }finally {
            try {
                connection.close();
            } catch (SQLException e) {
                e.printStackTrace();
            }
        }
    }



    @Override
    public List<Student> allListStudent() {
        List<Student> list = new ArrayList<>();
        Connection connection = getConnection();
        String sql="select *from student";
        try {
            PreparedStatement ps = connection.prepareStatement(sql);
            ResultSet rs = ps.executeQuery();
            while (rs.next()){
                String name=rs.getString("name");
                String dept=rs.getString("dept");
                Integer age=rs.getInt("age");
                Student student=new Student();
                student.setName(name);
                student.setAge(age);
                student.setDept(dept);
                list.add(student);
            }
        } catch (SQLException e) {
            e.printStackTrace();
        }
        return  list;
    }
}

代码如下（示例）：

2创建StudentDao接口便于StudentDaoImpl实现

package com.jsj.dao;

import com.jsj.entities.Student;

import java.util.List;

public interface StudentDao {

    void  saveStudent(Student student);


    List<Student> allListStudent();
}

3entities包下的Student类

package com.jsj.entities;

public class Student {
    private  int id;
    private String name;
    private int age;
    private String dept;

    public int getId() {
        return id;
    }

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

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public int getAge() {
        return age;
    }

    public void setAge(int age) {
        this.age = age;
    }

    public String getDept() {
        return dept;
    }

    public void setDept(String dept) {
        this.dept = dept;
    }
}

4servlet类下两个包

1、list

package com.jsj.servlet;

import com.jsj.dao.Impl.StudentDaoImpl;
import com.jsj.dao.StudentDao;
import com.jsj.entities.Student;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.sql.Connection;
import java.util.List;

public class list extends HttpServlet {
    StudentDao studentDao=new StudentDaoImpl();
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp)
            throws ServletException, IOException {
        List<Student> students=studentDao.allListStudent();
        req.setAttribute("students",students);
        req.getRequestDispatcher("listAllStudent.jsp").forward(req,resp);

    }

    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp)
            throws ServletException, IOException {
        this.doPost(req, resp);
    }
}

2.save

代码如下（示例）：

package com.jsj.servlet;
import com.jsj.dao.Impl.StudentDaoImpl;
import com.jsj.dao.StudentDao;
import com.jsj.entities.Student;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

public class save extends HttpServlet {
    StudentDao studentDao=new StudentDaoImpl();
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp)
            throws ServletException, IOException {
        req.setCharacterEncoding("utf-8");
        String name = req.getParameter("name");
        String dept = req.getParameter("dept");
        Integer age=Integer.parseInt(req.getParameter("age"));

        Student student=new Student();
        student.setName(name);
        student.setDept(dept);
        student.setAge(age);
        studentDao.saveStudent(student);


        resp.sendRedirect(req.getContextPath()+"/list");

    }

    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp)
            throws ServletException, IOException {
        this.doGet(req, resp);
    }
}

标题web.xml的配置问题

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
         version="4.0">
    <servlet>
        <servlet-name>list</servlet-name>
        <servlet-class>com.jsj.servlet.list</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>list</servlet-name>
        <url-pattern>/list</url-pattern>
    </servlet-mapping>
    <servlet>
        <servlet-name>save</servlet-name>
        <servlet-class>com.jsj.servlet.save</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>save</servlet-name>
        <url-pattern>/save</url-pattern>
    </servlet-mapping>
    <welcome-file-list>
        <welcome-file>list</welcome-file>
    </welcome-file-list>
</web-app>

jsp

listAllStudent.jsp

<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2021/7/2
  Time: 8:59
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
</head>
<body>
<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2021/6/21
  Time: 19:00
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>Title</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/bootstrap.css">
</head>
<body class="d-flex justify-content-center ">
<div class="w-50 ">
    <table class="table  table-sm" id="jwd1">
        <thead>
        <tr style="margin-top: 20px;">
            <th scope="col">#</th>
            <th scope="col">姓名</th>
            <th scope="col">年龄</th>
            <th scope="col">学院</th>
        </tr>
        </thead>
        <tbody>
        <c:forEach items="${students}" var="student" varStatus="status">
            <tr>
                <th scope="row">${status.count}</th>
                <td>${student.name}</td>
                <td>${student.age}</td>
                <td>${student.dept}</td>
            </tr>
        </c:forEach>
        </tbody>
    </table>
    <a href="saveStudentServlet.jsp" class=""btn btn-secondary>添加数据</a>
</div>
</body>
</html>

<script>
    function randomColor(){
        var str="rgba("+ parseInt(Math.random()*256)+","+parseInt(Math.random()*256)+","
            +parseInt(Math.random()*256)+","+parseInt(Math.random()*256);
        return str;
    }
    window.onload=function(){
            var oDiv=document.getElementById('jwd1');
            setInterval(function(){
                oDiv.style.background=randomColor();
            },1000);
        }
</script>
</body>
</html>

saveStudentServlet.jsp

<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2021/6/21
  Time: 19:05
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/bootstrap.css">
    <style>
        * {
            font-family: "Microsoft YaHei",sans-serif;
        }
        body {
            margin: 0;
            padding: 0;
            background: greenyellow;
            background-size: cover;
            background-repeat: no-repeat;
        }

        /*第1层*/
        .table {
            display: table;
            width: 100vw;
            height: 100vh;
            margin: 5px;
            background-image: linear-gradient(to right,rgba(0,0,0,0.6),rgba(0,0,0,0.1));
        }
        .div-body {
            display: table-cell;
            vertical-align: middle;
        }
        .panel-login {
            width: 758px;
            height: 420px;
            background: #0dcaf0;
            margin: auto;
            border-radius: 15px;
            box-shadow: 12px 12px 16px 8px rgba(0,0,0,0.3);

        }
        .panel-login-left {
            width: 40%;
            height: 100%;
            float: left;
            border-radius: 19px 0 0 19px;
            /*水平居中*/
            text-align: center;
            vertical-align: middle;
            background-color: #0dcaf0;
        }
        .panel-login-left .login-img {
            object-fit: cover;
            width: 50%;
            margin-top: 30%;
            border-radius: 12px;
            border-image-outset: 6px;
        }
        .panel-login-left a {
            color: #1e0604;
            text-decoration: none;
            font-weight: bold;
            font-size: 36px;
            text-shadow: 6px 6px 6px rgba(78,42,64,0.4);
        }
        .panel-login-left a:hover {
            color: #7b130a;
        }
        .panel-login-right {
            width: 60%;
            height: 420px;
            float: right;
            /*居中*/
            /*line-height: 420px;*/
            text-align: center;
        }
        .panel-login-right {
            background-color:rebeccapurple;
            background-position: top,left;
            background-repeat: no-repeat;
            background-size: cover;
        }

        .input-type-login {
            width: 80%;
            height: 420px;

        }
        .input-type-login p {
            font-size: 38px;
            font-weight: none;
            color: #2e2f1f;
            text-shadow: 6px 6px 6px rgba(78,42,64,0.4);
        }
        /*input控件样式*/
        .input-type-login .input {
            width: 100%;
            margin-bottom: 12px;
            margin-left: 32px;
            padding-top: 12px;
            padding-bottom: 12px;
            border-radius: 28px;
            outline: none;
        }
        /*文本框样式*/
        .text-style {
            box-shadow: 3px 3px 8px rgba(0,0,0,0.3);
            border-radius: 28px;
            border: 1px solid #7b49c6;
            padding-left: 32px;
        }
        .text-style:hover {
            box-shadow: 3px 3px 8px rgba(0,0,0,0.3);
            border-radius: 28px;
            border: 2px solid #920000;
            padding-left: 32px;
        }
        /*按钮样式*/
        .button-style {
            color: #dae5e7;
            border:none;
            background-image: linear-gradient(90deg,#e4c6d0,#c84064);
            transition-duration: 0.5s;
            box-shadow: 6px 6px 16px rgba(234,81,127,0.7);
        }
        .button-style:hover{
            background-image: linear-gradient(90deg,#e6e6fa,#ad2e28);
            color: #e3f9fd;
        }
        .input-type-login .a-register {
            width: 100%;
            color: #5a0403;
            text-decoration:none;
        }
        .input-type-login .a-register:hover {
            width: 100%;
            color: #c3060a;
            text-decoration:none;
        }

        /* #8b2671 青莲*/

        .panel-other {
            float: right;
            width: 100px;
            height: 100vh;
            /* background-color: #c84064; */

        }
        .panel-other-top {
            position: absolute;
            top: 0;
            width: 100px;
            height: 200px;
            background-color: rebeccapurple;
            background-size: cover;
            background-repeat: no-repeat;
        }
        .panel-other-bottom {
            position: absolute;
            bottom: 0;
            width: 100px;
            height: 100px;
            background-color: lightgoldenrodyellow;
            background-size: cover;
            background-repeat: no-repeat;
        }
    </style>
</head>
<%--<body class="d-flex justify-content-center align-items-center">--%>
<%--<div class="w-25 border p-3 shadow .rounded-3   border-radius: 50%">--%>
<%--    <h3 style="text-align: center">添加数据</h3>--%>
<%--    <form action="${pageContext.request.contextPath}/save"method="post">--%>

<%--        <div class="mb-3">--%>
<%--            <label for="name" class="form-label">姓名</label>--%>
<%--            <input type="text" class="form-control" id="name" placeholder="姓名" name="name">--%>
<%--        </div>--%>

<%--        <div class="mb-3">--%>
<%--            <label for="age" class="form-label">年龄</label>--%>
<%--            <input type="text" class="form-control" id="age" placeholder="年龄" name="age">--%>
<%--        </div>--%>

<%--        <div class="mb-3">--%>
<%--            <label for="dept" class="form-label">院系</label>--%>
<%--            <input type="text" class="form-control" id="dept" placeholder="院系" name="dept">--%>
<%--        </div>--%>
<%--        <div class="mb-3">--%>
<%--            <button type="submit" class="btn btn-primary" value="保存">保存</button>--%>
<%--        </div>--%>

<%--    </form>--%>
<%--</div>--%>
<%--</body>--%>
<%--</html>--%>

<%--<html lang="en">--%>
<%--<head>--%>
<%--<meta charset="UTF-8">--%>
<%--<title>login</title>--%>

<%--</head>--%>
<%--<body>--%>
<form action="${pageContext.request.contextPath}/save"method="post">
    <div class="table">
        <div class="div-body">
            <div class="panel-login">
                <div class="panel-login-left">
                    <img src="#" class="login-img"/>
                    <p><a href="#">添加数据</a></p>
                </div>
                <div class="panel-login-right">
                    <div class="input-type-login">
                        <p>添加数据</p>
                        <input type="text" placeholder="姓名" id="name" name="name" class="text-style input">
                        <input type="text" placeholder="年龄" id="age" name="age" class="text-style input">
                        <input type="text" placeholder="院系" id="dept" name="dept" class="text-style input">
                        <input type="submit" value="保存" class="button-style input">
                    </div>
                </div>
            </div>
        </div>
    </div>
</form>
</body>
</html>

该处使用的url网络请求的数据。

---

总结

提示：这里对文章进行总结：
例如：以上就是今天要讲的内容，本文仅仅简单介绍了pandas的使用，而pandas提供了大量能使我们快速便捷地处理数据的函数和方法。