原文：http://www.open-open.com/lib/view/open1383622135586.html

Thymeleaf是一个XML/XHTML/HTML5模板引擎，可用于Web与非Web环境中的应用开发。它是一个开源的Java库，基于Apache License 2.0许可，由Daniel Fernández创建，该作者还是Java加密库Jasypt的作者。

Thymeleaf提供了一个用于整合Spring MVC的可选模块，在应用开发中，你可以使用Thymeleaf来完全代替JSP，或其他模板引擎，如Velocity、FreeMarker等。Thymeleaf的主要目标在于提供一种可被浏览器正确显示的、格式良好的模板创建方式，因此也可以用作静态建模。你可以使用它创建经过验证的XML与HTML模板。相对于编写逻辑或代码，开发者只需将标签属性添加到模板中即可。接下来，这些标签属性就会在DOM（文档对象模型）上执行预先制定好的逻辑。

示例模板：

<table>
  <thead>
    <tr>
      <th th:text="#{msgs.headers.name}">Name</td>
      <th th:text="#{msgs.headers.price}">Price</td>
    </tr>
  </thead>
  <tbody>
    <tr th:each="prod : ${allProducts}">
      <td th:text="${prod.name}">Oranges</td>
      <td th:text="${#numbers.formatDecimal(prod.price,1,2)}">0.99</td>
    </tr>
  </tbody>
</table>

这段介绍下面的实例模板 稍后我会逐一解释

使用步骤

第一步 往 html页面加入头文件 相应的schema 就是这个网址

1
2
3
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:th="http://www.thymeleaf.org">

第二步就是你的原始模板

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<table class="box-table-a">
        <caption>thyMeleaf使用教程</caption>
        <thead>
            <tr>
                <th scope="col">ID</th>
                <th scope="col">这是标题1</th>
                <th scope="col">这是标题2</th>
                <th scope="col">这是标题3</th>
                 
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>1</td>
                <td>朱遇平</td>
                <td>java</td>
                <td>程序猿</td>
                 
            </tr>
                             
            <tr>
                <td>2</td>
                <td>张三</td>
                <td>php</td>
                <td>程序猿</td>
                 
            </tr>
            <tr>
                <td>3</td>
                <td>李四</td>
                <td>c++</td>
                <td>程序猿</td>
                 
            </tr>
         
        </tbody>
    </table>

第三部就是怎么采用ThyMeleaf标签替换这些了 而不用改动模板以及样式 thyMeleaf 是一个基于标签 自定义属性实现的一个模板引擎 ，这里怎么配置Thymeleaf先不说 到后面再说，先说说他的标签用法

网上有一篇文章 总结的不错 地址 http://www.blogjava.net/bjwulin/archive/2013/02/07/395234.html

这里我想详细的讲下 讲完了 我就把上面的模型改成修改后的

# 代表 获取对象 从 messages bundle 也就是消息的资源本地化文件

$ 表示从model里面获取

# $这2个可以一起用 比如#{'system.'+${model.id}}  -----这相当于 #{system.01}的资源本地化文件中的system.01内容

下面介绍常用的标签

th:fragment=“public” 相当于 include标签

th:each="user : ${users}" 相当于c:foreach  使用时候

如上面

<tr th:each="user : ${users}">

<td th:text="${user.id}">01</td>

<td th:text="${user.name}">朱遇平</td>

<td th:text="${user.xx}">java</td>

<td th:text="${user.xx}">程序员</td>

</tr>

这些静态数据不要管他 当运行时候自动替换

上面注意到th:text="${user.id}" 这是代表着运行时候动态设置标签为用户的id属性的值

th:href="@{/users/delete(id=${u.id})}">

这是动态设置url属性参考上面的文章总结

在表单的环境下 有时候我们可能需要动态数据绑定

OK thymeleaf 也有相关标签

首先了解的是

<form action="#" th:action="@{/users/add}" th:object="${myuser}" method="post">

这里th：Object表示表单与 改myuser注入的实体映射，

在表单 th:field="*{id} 则表示 该表单的值 与 myuser的id绑定

这里注意到 我上面的遍历表格只改了一个 其他的三个 你不是说可以不用改模板的 的 那该怎么办啊

th:remove="all"  使用了该标签 将在运行时候移除所有的元素

<tr th:remove="all">

</tr>

上面的其他几行 就直接相当于忽略他了

趁着中午的时间 更新下。这里先讲到这里了 有时间补充更新 它的配置 以及 spring整合

有人问我该怎么呢使用if 突然想到 我上面好像忘了讲这个

经常有由td 表格展示某一行要判断的情况

 
1
<td class="status" th:if="${#strings.isEmpty(status)}" th:text="这状态为空">这里显示状态不为空</td>

同理

1
${not #strings.isEmpty(status)}

换p标签 只要把td改成p标签即可

这里要提一下strings哪里来的 上面我们引用的那篇博文上的一段话

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
表达式基本对象：
#ctx：context object
#root或者#vars
#locale
#httpServletRequest
#httpSession
 
表达式功能对象：
#dates：java.util.Date的功能方法类。
#calendars:类似#dates，面向java.util.Calendar
#numbers:格式化数字的功能方法类。
#strings：字符串对象的功能类，contains,startWiths,prepending/appending等等。
#objects:对objects的功能类操作。
#bools:对布尔值求值的功能方法。
#arrays：对数组的功能类方法。
#lists:对lists功能类方法
#sets
#maps
#aggregates:对数组或者集合创建聚合的功能方法，
th:text="${#aggregates.sum(o.orderLines.{purchasePrice * amount})}"
 
#messages:在变量表达式中获取外部信息的功能类方法。
#ids：处理可能重复的id属性的功能类方法。

看到strings了没

HTML5模板引擎 Thymeleaf 教程（转）的更多相关文章

  1. Spring Boot （四）模板引擎Thymeleaf集成

    一.Thymeleaf介绍 Thymeleaf是一种Java XML / XHTML / HTML5模板引擎,可以在Web和非Web环境中使用.它更适合在基于MVC的Web应用程序的视图层提供XHTM ...

  2. 新一代Java模板引擎Thymeleaf

    新一代Java模板引擎Thymeleaf-spring,thymeleaf,springboot,java 相关文章-天码营 https://www.tianmaying.com/tutorial/u ...

  3. SpringBoot：模板引擎 thymeleaf、ContentNegotiatingViewResolver、格式化转换器

    目录 模板引擎 thymeleaf ContentNegotiatingViewResolver 格式化转换器 模板引擎 thymeleaf.ContentNegotiatingViewResolve ...

  4. .net 开源模板引擎jntemplate 教程：基础篇之语法

    一.基本概念 上一篇我们简单的介绍了jntemplate并写了一个hello world(如果没有看过的,点击查看),本文将继续介绍jntemplate的模板语法. 我们在讲解语法前,首先要了解一下标 ...

  5. .net 开源模板引擎jntemplate 教程：基础篇之在ASP.NET MVC中使用Jntemplate

    在ASP.NET MVC 中使用Jntemplate 上一篇我们详细介绍了jntemplate的标签语法,本篇文章将继续介绍如何在ASP.NET MVC 中使用Jntemplate. 一.使用Jnte ...

  6. Spring MVC ： Java模板引擎 Thymeleaf (二）

    本文原计划直接介绍Thymeleaf的视图解析,但考虑到学习的方便,决定先构建一个spring-mvc. 以下的全部过程仅仅要一个记事本和JDK就够了. 第一步,使用maven构建一个web app. ...

  7. SpringBoot入门：新一代Java模板引擎Thymeleaf（理论）

    Spring Boot 提供了spring-boot-starter-web来为Web开发予以支持,spring-boot-starter-web为我们提供了嵌入的Tomcat以及SpringMVC的 ...

  8. springboot:Java模板引擎Thymeleaf介绍

    Thymeleaf是一款用于渲染XML/XHTML/HTML5内容的模板引擎.类似JSP,Velocity,FreeMaker等,它也可以轻易的与Spring MVC等Web框架进行集成作为Web应用 ...

  9. 8.SpringBoot 模板引擎 Thymeleaf

    1.模板引擎原理 JSP.Velocity.Freemarker.Thymeleaf 都是模板引擎.SpringBoot推荐的Thymeleaf:语法更简单,功能更强大: Thymeleaf模板引擎 ...

随机推荐

  1. 在ios微信客户端遇到的坑，input等错位

    1.判断移动端设备 // 处理iOS 微信客户端弹窗状态下调起输入法后关闭输入法页面元素错位解决办法 var ua = window.navigator.userAgent.toLowerCase() ...

  2. Jmeter_选项_函数助手对话框_CSVRead

    1.之前有写过Jmeter_请求原件之参数化CSV 2.这次是使用函数助手 CSVRead去进行处理 3.作用注册10个账户 4.线程组设置,10个线程进行,因为是注册10个账户,如果线程设置为1,循 ...

  3. jq鼠标移入移除事件

    mouseover与mouseenter 不论鼠标指针穿过被选元素或其子元素,都会触发 mouseover 事件.只有在鼠标指针穿过被选元素时,才会触发 mouseenter 事件. mouseout ...

  4. 【PAT甲级】1089 Insert or Merge (25 分)（插入排序和归并排序）

    题意: 输入一个正整数N(<=100),接着输入两行N个整数,第一行表示初始序列,第二行表示经过一定程度的排序后的序列.输出这个序列是由插入排序或者归并排序得到的,并且下一行输出经过再一次排序操 ...

  5. 好用的px转rem插件cssrem

    下载本项目,比如:git clone https://github.com/flashlizi/cssrem 进入packages目录:Sublime Text -> Preferences - ...

  6. 吴裕雄 Bootstrap 前端框架开发——简例

    <!DOCTYPE html> <html> <head> <title>Bootstrap 模板</title> <meta cha ...

  7. JavaWeb项目用浏览器打开网页出现Session Error提示的解决办法

    找到web.xml配置的原始配置的位置: <servlet> <servlet-name>dwr-invoker</servlet-name> <servle ...

  8. php对象、面向对象

    对象 万物皆对象 一切可见之物都是对象 一切不可见之物也是(抽象的事物也是对象): 对象包含两部分 1对象的组成元素 对象的数据模型又称为对象的属性,又被称为对象的成员变量 2.对象的行为 是对象的行 ...

  9. 如何解决Serv-U管理密码忘记

    如何解决Serv-U管理密码忘记 2016-06-17 15:46:48 2581次 解决方法: 点击“FTP服务器”,停止FTP服务器.进入Serv-U安装目录,默认C:Program FilesS ...

  10. iOS 开发之 生产者与消费者模式及其实现

    概念: 在工作中,大家可能会碰到这样一种情况:某个模块负责产生数据,这些数据由另一个模块来负责处理(此处的模块是广义的,可以是类.函数.线程.进程等).产生数据的模块,就形象地称为生产者:而处理数据的 ...