Thymeleaf可用于前后端分离， 下图，value="aa"， 在本地静态资源可以改变值，但是在web端不可以
前端可以在本地测试，有数据了显示数据 所以前后端分离
th属性
常用th属性解读
html 有的属性， Thymeleaf 基本都有，而常用的属性大概有七八个。其中 th 属性执行的优先级从 1~8 ，数字越低优先级越高。
一、 th:text ：设置当前元素的文本内容，相同功能的还有 th:utext ，两者的区别在于前者不会转义 html 标签，后者会。优先级不高： order=7二、 th:value ：设置当前元素的 value 值，类似修改指定属性的还有 th:src ， th:href 。优先级不高： order=6三、 th:each ：遍历循环元素，和 th:text 或 th:value 一起使用。注意该属性修饰的标签位置，详细往后看。优先级很高： order=2四、 th:if ：条件判断，类似的还有 th:unless ， th:switch ， th:case 。优先级较高： order=3五、 th:insert ：代码块引入，类似的还有 th:replace ， th:include ，三者的区别较大，若使用不恰当会破坏 html 结构，常用于公共代码块提取的场景。优先级最高： order=1六、 th:fragment ：定义代码块，方便被 th:insert 引用。优先级最低： order=8七、 th:object ：声明变量，一般和 *{} 一起配合使用，达到偷懒的效果。优先级一般： order=4八、 th:attr ：修改任意属性，实际开发中用的较少，因为有丰富的其他 th 属性帮忙，类似的还有 th:attrappend ，th:attrprepend 。优先级一般： order=5
常用th属性使用
使用 Thymeleaf 属性需要注意点以下五点：一、若要使用 Thymeleaf 语法，首先要声明名称空间：xmlns:th="http://www.thymeleaf.org"二、设置文本内容 th:text ，设置 input 的值 th:value ，循环输出 th:each ，条件判断 th:if ，插入代码块 th:insert ，定义代码块 th:fragment ，声明变量 th:object三、 th:each 的用法需要格外注意，打个比方：如果你要循环一个 div 中的 p 标签，则 th:each 属性必须放在 p 标签上。若你将 th:each 属性放在 div 上，则循环的是将整个 div 。四、变量表达式中提供了很多的内置方法，该内置方法是用 # 开头，请不要与 #{} 消息表达式弄混。五、 th:insert ， th:replace ， th:include 三种插入代码块的效果相似，但区别很大。pom.xml 引入 Thymeleaf 的依赖，并确定其版本
th:text:
th:value:
th:each：
th:if：
flag=false时，整个p标签不显示，可以用作登录，登录显示，不登录不显示。
th:insert： th:fragment：
th:object：
标准表达式语法
${...} 变量表达式， Variable Expressions@{...} 链接表达式， Link URL Expressions#{...} 消息表达式， Message Expressions~{...} 代码块表达式， Fragment Expressions*{...} 选择变量表达式， Selection Variable Expressions变量表达式使用频率最高，其功能也是非常的丰富。所以我们先从简单的代码块表达式开始，然后是消息表达式，再是链接表达式，最后是变量表达式，随带介绍选择变量表达式。
链接表达式好处
不管是静态资源的引用， form 表单的请求，凡是链接都可以用 @{...} 。这样可以动态获取项目路径，即便项目名变了，依然可以正常访问链接表达式结构无参： @{/xxx}有参： @{/xxx(k1=v1,k2=v2)} 对应 url 结构： xxx?k1=v1&k2=v2引入本地资源： @{/ 项目本地的资源路径 }引入外部资源： @{/webjars/ 资源在 jar 包中的路径 }列举：第三部分的实战引用会详细使用该表达式
常用的内置方法
一、 strings ：字符串格式化方法，常用的 Java 方法它都有。比如： equals ， equalsIgnoreCase ， length ， trim ，toUpperCase ， toLowerCase ， indexOf ， substring ， replace ， startsWith ， endsWith ， contains ，containsIgnoreCase 等二、 numbers ：数值格式化方法，常用的方法有： formatDecimal 等三、 bools ：布尔方法，常用的方法有： isTrue ， isFalse 等四、 arrays ：数组方法，常用的方法有： toArray ， length ， isEmpty ， contains ， containsAll 等五、lists，sets：集合方法，常用的方法有： toList ， size ， isEmpty ， contains ， containsAll ， sort 等六、 maps ：对象方法，常用的方法有： size ， isEmpty ， containsKey ， containsValue 等七、 dates ：日期方法，常用的方法有： format ， year ， month ， hour ， createNow 等
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>ITDragon Thymeleaf 内置方法</title>
</head>
<body>
<h2>ITDragon Thymeleaf 内置方法</h2>
<h3>#strings </h3>
<div th:if="${not #strings.isEmpty(itdragonStr)}" >
<p>Old Str : <span th:text="${itdragonStr}"/></p>
<p>toUpperCase : <span th:text="${#strings.toUpperCase(itdragonStr)}"/></p>
<p>toLowerCase : <span th:text="${#strings.toLowerCase(itdragonStr)}"/></p>
<p>equals : <span th:text="${#strings.equals(itdragonStr, 'itdragonblog')}"/></p>
<p>equalsIgnoreCase : <span th:text="${#strings.equalsIgnoreCase(itdragonStr,
'itdragonblog')}"/></p>
<p>indexOf : <span th:text="${#strings.indexOf(itdragonStr, 'r')}"/></p>
<p>substring : <span th:text="${#strings.substring(itdragonStr, 2, 8)}"/></p>
<p>replace : <span th:text="${#strings.replace(itdragonStr, 'it', 'IT')}"/></p>
<p>startsWith : <span th:text="${#strings.startsWith(itdragonStr, 'it')}"/></p>
<p>contains : <span th:text="${#strings.contains(itdragonStr, 'IT')}"/></p>
</div>
<h3>#numbers </h3>
<div>
<p>formatDecimal 整数部分随意，小数点后保留两位，四舍五入: <span
th:text="${#numbers.formatDecimal(itdragonNum, 0, 2)}"/></p>
<p>formatDecimal 整数部分保留五位数，小数点后保留两位，四舍五入: <span
th:text="${#numbers.formatDecimal(itdragonNum, 5, 2)}"/></p>
</div>
<h3>#bools </h3>
<div th:if="${#bools.isTrue(itdragonBool)}">
<p th:text="${itdragonBool}"></p>
</div>
<h3>#arrays </h3>
<div th:if="${not #arrays.isEmpty(itdragonArray)}">
<p>length : <span th:text="${#arrays.length(itdragonArray)}"/></p>
<p>contains : <span th:text="${#arrays.contains(itdragonArray, 5)}"/></p>
<p>containsAll : <span th:text="${#arrays.containsAll(itdragonArray,
itdragonArray)}"/></p>
</div>
<h3>#lists </h3>
<div th:if="${not #lists.isEmpty(itdragonList)}">
<p>size : <span th:text="${#lists.size(itdragonList)}"/></p>
<p>contains : <span th:text="${#lists.contains(itdragonList, 0)}"/></p>
<p>sort : <span th:text="${#lists.sort(itdragonList)}"/></p>
</div>
后台给负责给变量赋值，和跳转页面。
4.3 总结
一、Thymeleaf 是Spring Boot 官方推荐的Java模版引擎框架，其文件扩展名为.html
二、Thymeleaf 几乎支持所有的html属性，用于赋值的th:text和th:value，用于循环遍历的th:each，用于条件判
断的th:if
三、Thymeleaf 提供四种标准的表达式，有丰富内置方法的${}，用于国际化的#{}，用于代码插入的~{}，用于处理
链接的@{}
四、一定要注意循环遍历的th:each和代码插入的th:insert用法，尽量避免破坏html结构的细节问题
<h3>#maps </h3>
<div th:if="${not #maps.isEmpty(itdragonMap)}">
<p>size : <span th:text="${#maps.size(itdragonMap)}"/></p>
<p>containsKey : <span th:text="${#maps.containsKey(itdragonMap, 'thName')}"/></p>
<p>containsValue : <span th:text="${#maps.containsValue(itdragonMap, '#maps')}"/>
</p>
</div>
<h3>#dates </h3>
<div>
<p>format : <span th:text="${#dates.format(itdragonDate)}"/></p>
<p>custom format : <span th:text="${#dates.format(itdragonDate, 'yyyy-MM-dd
HH:mm:ss')}"/></p>
<p>day : <span th:text="${#dates.day(itdragonDate)}"/></p>
<p>month : <span th:text="${#dates.month(itdragonDate)}"/></p>
<p>monthName : <span th:text="${#dates.monthName(itdragonDate)}"/></p>
<p>year : <span th:text="${#dates.year(itdragonDate)}"/></p>
<p>dayOfWeekName : <span th:text="${#dates.dayOfWeekName(itdragonDate)}"/></p>
<p>hour : <span th:text="${#dates.hour(itdragonDate)}"/></p>
<p>minute : <span th:text="${#dates.minute(itdragonDate)}"/></p>
<p>second : <span th:text="${#dates.second(itdragonDate)}"/></p>
<p>createNow : <span th:text="${#dates.createNow()}"/></p>
</div>
</body>
</html>。
