博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Thymeleaf模板引擎
阅读量:5063 次
发布时间:2019-06-12

本文共 2758 字,大约阅读时间需要 9 分钟。

1.Thymeleaf简介

  Thymeleaf是一个现代服务器端Java模板引擎,适用于Web和独立环境,能够处理HTML,XML,JavaScript,CSS甚至纯文本。

  Thymeleaf的主要目标是提供一种优雅且高度可维护的模板创建方式。为实现这一目标,它以自然模板的概念为基础,将其逻辑注入模板文件,其方式不会影响模板被用作设计原型。这改善了设计沟通,缩小了设计和开发团队之间的差距。

2.添加jar包依赖

org.springframework.boot
spring-boot-starter-thymeleaf

 

3.在html文件夹下添加引用

Insert title here

 

4.语法

  • 1.变量表达式
  • 2.选择或星号表达式
  • 3.文字国际化表达式
  • 4.URL表达式

4.1 变量表达式

<span th:text="${name}">12345678</span>

<ul>

<li th:each="item :${list}" th:text="${item}"></li>
</ul>

4.2  *表达式

星号语法评估在选定对象(父标签的值)上表达

Name: Sebastian.

Surname: Pepper.

Nationality: Saturn.

 

4.3 url表达式

 

5.常用标签

关键字 功能介绍 案例
th:id 替换id <input th:id="'xxx' + ${collect.id}"/>
th:text 文本替换 <p th:text="${collect.description}">description</p>
th:utext 支持html的文本替换 <p th:utext="${htmlcontent}">conten</p>
th:object 替换对象 <div th:object="${session.user}">
th:value 属性赋值 <input th:value="${user.name}" />
th:with 变量赋值运算 <div th:with="isEven=${prodStat.count}%2==0"></div>
th:style 设置样式 th:style="'display:' + @{(${sitrue} ? 'none' : 'inline-block')} + ''"
th:onclick 点击事件 th:onclick="'getCollect()'"
th:each 属性赋值 tr th:each="user,userStat:${users}">
th:if 判断条件 <a th:if="${userId == collect.userId}" >
th:unless 和th:if判断相反 <a th:href="@{/login}" th:unless=${session.user != null}>Login</a>
th:href 链接地址 <a th:href="@{/login}" th:unless=${session.user != null}>Login</a> />
th:switch 多路选择 配合th:case 使用 <div th:switch="${user.role}">
th:case th:switch的一个分支 <p th:case="'admin'">User is an administrator</p>
th:fragment 布局标签,定义一个代码片段,方便其它地方引用 <div th:fragment="alert">
th:include 布局标签,替换内容到引入的文件 <head th:include="layout :: htmlhead" th:with="title='xx'"></head> />
th:replace 布局标签,替换整个标签到引入的文件 <div th:replace="fragments/header :: title"></div>
th:selected selected选择框 选中 th:selected="(${xxx.id} == ${configObj.dd})"
th:src 图片类地址引入 <img class="img-responsive" alt="App Logo" th:src="@{/img/logo.png}" />
th:inline 定义js脚本可以使用变量 <script type="text/javascript" th:inline="javascript">
th:action 表单提交的地址 <form action="subscribe.html" th:action="@{/subscribe}">
th:remove 删除某个属性 <tr th:remove="all"> 1.all:删除包含标签和所有的孩子。2.body:不包含标记删除,但删除其所有的孩子。3.tag:包含标记的删除,但不删除它的孩子。4.all-but-first:删除所有包含标签的孩子,除了第一个。5.none:什么也不做。这个值是有用的动态评估。
th:attr 设置标签属性,多个属性可以用逗号分隔 比如 th:attr="src=@{/image/aa.jpg},title=#{logo}",此标签不太优雅,一般用的比较少。

 

6.代码示例

  Login

Today is: 13 May 2011

//foreach       1                       Mark     Otto     @mdo     index 

注:terStat称作状态变量,属性有:

  • index:当前迭代对象的index(从0开始计算)
  • count: 当前迭代对象的index(从1开始计算)
  • size:被迭代对象的大小
  • current:当前迭代变量
  • even/odd:布尔值,当前循环是否是偶数/奇数(从0开始计算)
  • first:布尔值,当前循环是否是第一个
  • last:布尔值,当前循环是否是最后一个

7.

转载于:https://www.cnblogs.com/dztHome/p/10308023.html

你可能感兴趣的文章
样式加载顺序
查看>>
将 SharePoint 网站另存为模板
查看>>
H5 视频作为背景 source src改变后 循环播放的问题笔记
查看>>
git教程 入门
查看>>
erlang-jiffy 安装手记
查看>>
javascript实现页面滚屏效果
查看>>
[Linux]非常方便的上传下载文件工具rz和sz
查看>>
Locust性能测试_百度案例
查看>>
Struts2源码浅析-ResultType
查看>>
apply的理解和数组降维
查看>>
django-rest-framework
查看>>
git的安装和常用命令
查看>>
JS 定义变量
查看>>
JumpServer里的sftp功能报错说明
查看>>
Model/ModelMap 和 ModelAndView 的区别使用
查看>>
寒假编程总结一
查看>>
python基础--网站推荐
查看>>
使用CPU探查器优化XAML程序
查看>>
Jmeter接口测试+压力测试+环境配置+证书导出
查看>>
node.js初识06
查看>>