25-springboot-thymeleaf的常见属性
th:action
<form id="login" th:action="@{/login}">......</form>
th:method
<form id="login" th:action="@{/login}" th:method="post">......</form>
th:href
<a class="login" th:href="@{/login}">登录</a>
th:id
<span th:id="${msg}">aaa</span>
<input id="nick" name="nick">
th:name
<input th:type="text" th:id="phone" th:name="phone">
th:value
<input type="hidden" id="userId" name="userId" th:value="${user.id}">
th:attr
<input type="hidden" id="userId" name="userId" th:attr="value=${userId}" >
th:text 用于文本的显示
<input type="text" id="realName" name="reaName" th:text="${realName}">
th:onclick
th:onclick="'getCollect()'"
th:style
th:style="'display:none;'"
th:if
条件判断，比如后台传来一个变量，判断该变量的值，1为男，2为女：
<span th:if="${sex} == 1" >
<input type="radio" name="se" th:value="nan" />
</span>
<span th:if="${sex} == 2">
<input type="radio" name="se" th:value="nv" />
</span>
th:unless
th:unless是th:if的一个相反操作：
<span th:unless="${sex} == 1" >
<input type="radio" name="se" th:value="nv" />
</span>
<span th:unless="${sex} == 2">
<input type="radio" name="se" th:value="nan" />
</span>
th:src
常与@{}表达式结合使用；
<script th:src="@{/js/jquery.min.js}"></script>
<img th:src="@{/image/beijing.gif}"/> 导入图片
th:each
这个属性非常常用，用于对集合进行遍历输出，它与JSTL中的<c: forEach>类似；
<tr th:each="user, interStat : ${userList}">
<td th:text="${interStat.index}"></td>
<td th:text="${user.id}"></td>
<td th:text="${user.nick}"></td>
<td th:text="${user.phone}"></td>
<td th:text="${user.email}"></td>
<td th:text="${user.address}"></td>
</tr>
Map类型的循环：
<div th:each="myMapVal : ${myMap}">
<span th:text="${myMapVal.key}"></span>
<span th:text="${myMapVal.value}"></span>
</div>
${myMapVal.key} 是获取map中的key，${myMapVal.value} 是获取map中的value；
数组类型的循环：
<div th:each="myArrayVal : ${myArray}">
<div th:text="${myArrayVal}"></div>
</div>
th:inline
内联文本、内联脚本
th:inline 有三个取值类型 (text, javascript 和 none)
该属性使用内联表达式[[…]]展示变量数据，比如：
内联文本
<span th:inline="text">
Hello, [[${user.nick}]]
</span>
等同于：
<span>
Hello, <span th:text="${user.nick}"></span>
</span>
th:inline写在任何父标签都可以，比如如下也是可以的：
<body th:inline="text">
...
<span>[[${user.nick}]]</span>
...
</body>
使用场景：如果你不想依赖html标签就能进行动态数据展示，那么可以使用内联文本；
内联脚本
<script th:inline="javascript" type="text/javascript">
var user = [[${user.phone}]];
alert(user);
</script>
使用场景：如果你需要在javascript代码中获取动态数据，那么就需要使用内联脚本；
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· winform 绘制太阳，地球，月球 运作规律
· 震惊！C++程序真的从main开始吗？99%的程序员都答错了
· AI与.NET技术实操系列（五）：向量存储与相似性搜索在 .NET 中的实现
· 超详细：普通电脑也行Windows部署deepseek R1训练数据并当服务器共享给他人
· 【硬核科普】Trae如何「偷看」你的代码？零基础破解AI编程运行原理