Thymleaf引擎模板的使用

小兔叽 可爱的博主

时间: 2020-10-14 阅读: 124 字数:3887

Thymleaf idea html
{}
Thymeleaf是一种用于Web和独立环境的现代服务器端的Java模板引擎。

<h1>Thymleaf介绍</h1> <h3>一、读者引言</h3> <p>本教程面向需要学Thymeleaf，维护和开发Web应用的开发人员。 完成本教程的学习之后，您将熟悉并能上手使用Thymeleaf模板。也可以将Thymeleaf用作未来开发应用的一项目技术。 </p> <h3>二、为什么使用Thymleaf</h3>

JSP的致命缺陷：

前端工程师拿到JSP文件后，没法直接放在浏览器上查看布局、动态效果等等显示效果。所以，基于JSP无法和前端工程师进行协同工作。而Thymeleaf中所有的动态效果都不影响原本HTML标签的显示。当一个前端工程师拿到Thymeleaf文件后，可以直接放在浏览器上查看显示效果，看代码时忽略动态部分即可。

<p>Thymeleaf的主要目标是将优雅的自然模板带到开发工作流程中，并将HTML在浏览器中正确显示，并且可以作为静态原型，让开发团队能更容易地协作。Thymeleaf能够处理HTML，XML，JavaScript，CSS甚至纯文本。</p> 因此使用<code>Thymleaf</code> <h3>三、开始使用Thymleaf</h3> <h4>1、配置Thymleaf所需要的环境</h4> <p>①Pom文件添加Thymleaf的依赖（在SpringBoot环境下加入Thymeleaf）</p> <p>使用springboot环境下需要配置yml</p> 

spring:
  thymeleaf:
    prefix: classpath:/templates/
    suffix: .html
    cache: false #开发的时候禁用缓存

<dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>

<p>②Pom文件添加Thymleaf的依赖（添加独立Thymleaf）</p> 

<dependency>
            <groupId>org.thymeleaf</groupId>
            <artifactId>thymeleaf</artifactId>
            <version>3.0.7.RELEASE</version>
</dependency>

<p>在html上的<html>标签中添加配置名称空间<code>xmlns:th="http://www.thymeleaf.org"</code></p> 

<html xmlns:th="http://www.thymeleaf.org">

<h4>2、通过Thymeleaf读取域中的数据</h4>

注意：在使用Thymelef之前，必须在服务器端跑起来，如果没有跑起来服务器打开的网页是不可以解析这些标签的！这样的好处可以让前端的页面，后端人员通过更改后，前端在本地基本不会有影响！

一、事先在服务器，存入域数据

javaweb随便存入数据。

二、通过thymeleaf表达式取域数据，并显示在网页上

取域数据的语法

${属性名}

<h5>①、在request域中取出数据</h5> 

 <p th:text="${reqAttName}">sss</p>

<h5>②、在session域中取出数据</h5> 

 <p th:text="${session.sessionAttName}">sss</p>

<h5>③、在application域中取出数据</h5> 

 <p th:text="${application.sessionAttName}">sss</p>

<span>网页详情图</span>

三、解析URL地址

解析URL地址，最有用的是把开头的“/”解析为ContextPath，让我们能够在页面上动态获取ContextPath值

 @{/good/morning}

<h5>配置contextPath</h5> 

server
 port:1000#端口号
 context-path:/hello

如果设置contextPath为/hello，那么解析为<span>/hello/good/morning</span>

四、在HTML标签内执行表达式

  • (1) 操作标签体</span>

    在HTML标签内使用th:text属性

  • (2) 重置某个HTML标签本身存在的属性

    在HTML标签内使用th:xxx属性，xxx是想要替换为动态值的属性名

五、分支与迭代

(1)if判断

th:if="${not #strings.isEmpty(thIf)}

<h5>strings是内置对象，调用isEmpty()方法可以用来判断是否为空</h5>

(2)迭代

th:each="声明变量 : 取集合数据的表达式"

六、当前环境切换Thymeleaf版本[p]

 <properties>
    <!-- 切换 thymeleaf 版本 -->
    <thymeleaf.version>3.0.9.RELEASE</thymeleaf.version>
    <!-- 支持功能的支持程序 thymeleaf3 主程序 layout2 以上的版本 -->
    <thymeleaf-layout-dialect.version>2.1.1</thymeleaf-layout-dialect.version>
</properties>

妈呀！网页不见了害我重写了一遍！！！！！！有什么错误评论一下，谢谢！！！

本文章网址:https://www.sjxi.cn/detil/f2dbfbaf43ed428686a2218eb5e0cdba

最新评论

当前未登陆哦
登陆后才可评论哦

湘ICP备2021009447号

×

(穷逼博主)在线接单

QQ: 1164453243

邮箱: abcdsjx@126.com

前端项目代做
前后端分离
Python 爬虫脚本
Java 后台开发
各种脚本编写
服务器搭建
个人博客搭建
Web 应用开发
Chrome 插件编写
Bug 修复