探索Thymeleaf：用动态Web模板引擎打造吸引人的用户界面（SpringBoot的html详解）

什么是Thymeleaf？

Thymeleaf是一个用于Web和独立环境的现代服务器端Java模板引擎，用于处理XML/XHTML/HTML5内容。它特别适合基于Spring框架的Web应用程序，因为它提供了与Spring MVC的出色集成。Thymeleaf以其自然的模板语法和强大的数据绑定能力而闻名，使得开发者能够轻松地创建动态Web页面。

Thymeleaf的特点

自然模板技术：Thymeleaf的模板语法尽可能接近HTML，使得模板易于阅读和编写。
强大的数据绑定：支持多种数据绑定方式，包括标准表达式和选择表达式，使得数据展示更加灵活。
安全性：自动处理HTML转义，防止XSS攻击。
与Spring的集成：无缝集成Spring MVC，支持Spring的表达式语言（SpEL）。
高性能：通过缓存和优化的模板处理机制，提供快速的页面渲染速度。

Thymeleaf示例

以下是一个简单的Thymeleaf模板示例，展示了如何使用Thymeleaf来动态生成Web页面内容。

html 复制代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"  
        "http://www.w3.org/TR/html4/loose.dtd">  
<html lang="en" xmlns:th="http://www.thymeleaf.org">  
<head>  
    <title>Thymeleaf示例</title>  
    <!-- 样式省略 -->  
</head>  
<body>  
    <!-- 使用th:utext和th:id进行文本替换和ID设置 -->  
    <div th:utext="${hello}" th:id="${hello.toUpperCase()}">xxxx</div>  
  
    <!-- 直接从模型属性中获取值并填充到输入框 -->  
    <input th:value="${user.getUsername()}">  
  
    <!-- 使用th:object和*{}语法访问对象属性 -->  
    <div th:object="${user}">  
        <span th:text="*{username}"></span>  
    </div>  
  
    <!-- 条件渲染 -->  
    <a th:href="www.csdn.net" th:if="${user.getAge() == 2}">年龄</a>  
  
    <!-- 根据条件设置类名（注释掉的代码） -->  
    <!-- <a th:class="${user.getAge() > 2}?'class1':'class2'">年龄</a> -->  
  
    <!-- 成绩等级判断 -->  
    <p th:if="${user.score >= 60 and user.score < 85}">B</p>  
    <p th:if="${user.score < 60}">C</p>  
    <p th:if="${user.score > 85}">优秀</p>  
  
    <!-- 性别判断 -->  
    <span th:switch="${user.gender}">  
        <p th:case="1">男</p>  
        <p th:case="2">女</p>  
    </span>  
  
    <!-- 表格数据展示 -->  
    <table>  
        <tr>  
            <td>姓名</td>  
            <td>密码</td>  
            <td>序号</td>  
        </tr>  
        <tr th:each="a,aState:${uList}">  
            <td th:text="${a.username}"></td>  
            <td th:text="${a.password}"></td>  
            <td th:text="${aState.index}"></td>  
        </tr>  
    </table>  
</body>  
</html>

Controller部分

java 复制代码

package com.qcby.demo.controller;

import com.qcby.demo.entity.User;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;


import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpSession;
import java.util.ArrayList;
import java.util.List;

@Controller
@RequestMapping("/user")
public class UserController {
    @RequestMapping("/hello")
    public String hello(HttpServletRequest req, HttpSession httpSession, Model model){
        model.addAttribute("hello","<h1>renliang</h1>");
        User user = new User();
        user.setPassword("111");
        user.setUsername("renliang");
        user.setAge(2);
        user.setScore(78);
        user.setGender(2);
        List<User> uList = new ArrayList<>();
        for (int i = 0; i < 10; i++){
            User u = new User();
            u.setUsername("renliang"+i);
            u.setPassword("111"+i);

            uList.add(u);
        }

        // httpSession.setAttribute("user", user);
        model.addAttribute("user", user);
        model.addAttribute("uList", uList);
        return "user";
    }
}