总结：代码模板

目录

一、数据库（高手）

二、数据库(遗忘：100%)

二、创建Maven项目

2.1 web.xml

2.2 依赖

三、Thymeleaf初始化模板

3.1 新建目录结构

3.2 初始化代码

3.3 渲染

四、引入代码编辑器组件ace.js

五、获取 input标签输入的数据

六、获取select标签选中的元素

---

一、数据库（高手）

URL = "jdbc:mysql://127.0.0.1:3306/DatabaseName?characterEncoding=utf8&useSSL=false";

其中，DatabaseName是需要替换的数据库名称。

二、数据库(遗忘：100%)

public class DBUTil {
    private static final String URL = "jdbc:mysql://127.0.0.1:3306/messagewall?characterEncoding=utf8&useSSL=false";
    private static final String username = "root";
    private static final String password = "1111";
    private static DataSource dataSource = new MysqlDataSource();
    static {
        ((MysqlDataSource)dataSource).setURL(URL);
        ((MysqlDataSource)dataSource).setUser(username);
        ((MysqlDataSource)dataSource).setPassword(password);
    }
    public Connection getConnection() throws SQLException {
        return dataSource.getConnection();
    }
    public void close(Connection connection, PreparedStatement statement, ResultSet resultSet){
        if(resultSet != null){
            try {
                resultSet.close();
            } catch (SQLException throwables) {
                throwables.printStackTrace();
            }
        }
        if(statement != null){
            try {
                statement.close();
            } catch (SQLException throwables) {
                throwables.printStackTrace();
            }
        }
        if(connection != null){
            try {
                connection.close();
            } catch (SQLException throwables) {
                throwables.printStackTrace();
            }
        }
    }
}

二、创建Maven项目

2.1 web.xml

<!DOCTYPE web-app PUBLIC
        "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
        "http://java.sun.com/dtd/web-app_2_3.dtd" >
<web-app>
    <display-name>Archetype Created Web Application</display-name>
</web-app>

2.2 依赖

servlet：3.1.0 

Jackson：2.13.1

mysql：5.1.47 

thymeleaf：3.0.12

 <!-- https://mvnrepository.com/artifact/javax.servlet/javax.servlet-api -->
        <dependency>
            <groupId>javax.servlet</groupId>
            <artifactId>javax.servlet-api</artifactId>
            <version>3.1.0</version>
            <scope>provided</scope>
        </dependency>
        <!-- https://mvnrepository.com/artifact/com.fasterxml.jackson.core/jackson-databind -->
        <dependency>
            <groupId>com.fasterxml.jackson.core</groupId>
            <artifactId>jackson-databind</artifactId>
            <version>2.13.1</version>
        </dependency>
        <!-- https://mvnrepository.com/artifact/mysql/mysql-connector-java -->
        <dependency>
            <groupId>mysql</groupId>
            <artifactId>mysql-connector-java</artifactId>
            <version>5.1.47</version>
        </dependency>
        <!-- https://mvnrepository.com/artifact/org.thymeleaf/thymeleaf -->
        <dependency>
            <groupId>org.thymeleaf</groupId>
            <artifactId>thymeleaf</artifactId>
            <version>3.0.12.RELEASE</version>
        </dependency>

三、Thymeleaf初始化模板

3.1 新建目录结构

 3.2 初始化代码

    // 1.创建一个模板引擎对象
    private TemplateEngine engine = new TemplateEngine();
    // 2.因为servlet被加载的时候，会调用init方法，所以Thymeleaf的初始化就很适合放在这里
    @Override
    public void init() throws ServletException {
        // 2.1 创建一个ServletContextTemplateResolver对象，功能就是从磁盘上加载模板引擎文件
        ServletContextTemplateResolver resolver = new ServletContextTemplateResolver(getServletContext());
        //2.2 对resolver对象设置一些属性 加载 /WEB-INF/template/ 目录中, 以 .html 结尾的文件, 作为模板引擎
        resolver.setPrefix("/WEB-INF/template/");
        resolver.setSuffix(".html");
        resolver.setCharacterEncoding("utf-8");
        // 2.4 把resolver和engine关联起来
        engine.setTemplateResolver(resolver);
    }

3.3 渲染

        WebContext webContext = new WebContext(req,resp,getServletContext());
        webContext.setVariable("result",result);
        engine.process("guessNum",webContext, resp.getWriter());

出现这个后，就加上下面的依赖。

SLF4J: Failed to load class "org.slf4j.impl.StaticLoggerBinder".
SLF4J: Defaulting to no-operation (NOP) logger implementation
SLF4J: See http://www.slf4j.org/codes.html#StaticLoggerBinder for further details.

        <dependency>
            <groupId>org.slf4j</groupId>
            <artifactId>slf4j-nop</artifactId>
            <version>1.7.25</version>
        </dependency>

四、引入代码编辑器组件ace.js

// 引入ace.js
<script src="https://cdn.bootcss.com/ace/1.2.9/ace.js"></script>
<script src="https://cdn.bootcss.com/ace/1.2.9/ext-language_tools.js"></script>

// 将页面编辑框外面套一层 div, id 设为 editor, 并且一定要设置 min-height 属性.
<div id="editor" style="min-height:400px">
    <textarea style="width: 100%; height: 200px"></textarea>
</div>

// 对编译器进行初始化
function initAce() {
    // 参数 editor 就对应到刚才在 html 里加的那个 div 的 id
    let editor = ace.edit("editor");
    editor.setOptions({
        enableBasicAutocompletion: true,
        enableSnippets: true,
        enableLiveAutocompletion: true
    });
    editor.setTheme("ace/theme/twilight");
    editor.session.setMode("ace/mode/java");
    editor.resize();
    document.getElementById('editor').style.fontSize = '20px';

    return editor;
}

//获取刚刚初始化好的编译器
let editor = initAce();

// 由于ace.js会重新绘制页面，导致之前弄得textarea没了。因此需要换种方式
// 将代码设置到编译器中
editor.setValue(question.templateCode);

// 获取编译器中得代码
editor.getValue()

五、获取 input标签输入的数据

let titleInput = document.getElementById("title");
let title = titleInput.value;

六、获取select标签选中的元素

<select id="level">
    <option selected = "selected" style="color: white;">---请选择难度等级---</option>
    <option style="color: white;">简单</option>
    <option style="color: white;">一般</option>
</select>

let levelSelect = $("#level option:selected"); // 选取选中项
let level = levelSelect.text(); //拿到选中项的文本