代码片段-Thymeleaf常见用法（六）

最新推荐文章于 2023-06-07 01:26:22 发布
最新推荐文章于 2023-06-07 01:26:22 发布
阅读量2.8k 收藏 2
点赞数
分类专栏： Thymeleaf 文章标签： thymeleaf th-block th-fragmen

包含模板片段

实际中，经常需要包含代码片段，比如footer，header，menu等

定义代码片段

th:fragment

例如定义一个footer，如下：

<!DOCTYPE html>

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

<body>

<div th:fragment=“ copy” >

© 2011 The Good Thymes Virtual Grocery

</div>

</body>

</html>

如果某页面需要包含footer，则使用 th:insert或者th:replace，从Thymeleaf 3.0开始，不推荐使用th：include

插入片段例子：

<body>

…

<div th:insert=“ \~{footer :: copy}” ></div>

</body>

插入片段的三种语法：

\~{templatename::selector}— \~{templatename::fragmentname} 引用模板中的一个片段，一个区域

\~{templatename} 引用一个完整的模板

\~{::selector}” or “ \~{this::selector}” 引用本模板页中的片段

也可以使用id进行引用：

<div id=“ copy-section” >

© 2011 The Good Thymes Virtual Grocery

</div>

<body>

…

<div th:insert=“ \~{footer :: #copy-section}” ></div>

</body>

th:insert 和 th:replac**e区别**

th:insert，是最简单的，只是插入相关的片段

th：replace 用指定的替换现在的标签片段

th：insert 只是插入指定片段的内容

如下：片段：

<footer th:fragment=“ copy” >

© 2011 The Good Thymes Virtual Grocery

</footer>

插入替换：

<body>

…

<div th:insert=“ footer :: copy” ></div>

<div th:replace=“ footer :: copy” ></div>

<div th:include=“ footer :: copy” ></div>

</body>

结果：

<body>

…

<div>

<footer>

© 2011 The Good Thymes Virtual Grocery

</footer>

</div>

<footer>

© 2011 The Good Thymes Virtual Grocery

</footer>

<div>

© 2011 The Good Thymes Virtual Grocery

</div>

</body>

nowsdt
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Thymeleaf常用语法：模板片断
gdjlc的专栏
10-20 490
系统中的很多页面有很多公共内容，例如菜单、页脚等，这些公共内容可以提取放在一个称为“模板片断”的公共页面里面，其它页面可以引用这个 “模板片断”内容。 一、模板片断的定义 可以是html标签，也可以使用th:fragment属性定义片断。 二、引用片断 1、使用th:insert属性插入片断，除此之外，还可以使用th:replace和th:include插入。 语法：(1) th:ins...
Thymeleaf中文文档合集-最新版
08-20
`thymeleaf模板的使用.pdf`可能会详细解释如何设计Thymeleaf模板，包括模板继承、布局定义、片段重用等高级特性，以提高代码复用性和可维护性。 9. **学习笔记** `thymeleaf 学习笔记.pdf`可能是个人或社区整理的...
Thymeleaf公共代码段抽取、传参数，多参数写法，th:include, th:replace, th:insert
konnysnow的专栏
06-07 475
2，如何解决Thymeleaf：如何使用条件条件动态添加/删除CSS类。3：thymeleaf用if判断字符串。
Thymeleaf公共代码抽取
aidy2008的专栏
10-28 659
1公共代码 2引入公共代码 3处理高亮 4效果    
Thymeleaf基础（表达式）
桃子dev的博客
03-23 361
是什么？ Thymeleaf 是一个服务器端 Java 模板引擎，主要用来开发 Java 服务器端的 H5 。 怎么用？ 1.创建模板文件，引入命名空间，以HTML模板为例 1 <html xmlns:th="http://www.thymeleaf.org"> 2 　　 3 </html> 通过 <html xmlns:th="http://www.t...
Thymeleaf引入公共片段方式
weixin_30876945的博客
03-21 230
引入公共片段 引入公共片段的th属性，包括三种方式 th:insert 将公共片段，整个插入到声明引入的元素中 th:replace 将声明引入的元素，替换为公共片段 th:include 将被引入的片段的内容，包含进这个标签中 抽取公共片段 1 <footer th:fragment="copy"> 2 &copy; 2011 The Good Thy...
thymeleaf3.0.5
12-31
在本文中，我们将深入探讨Thymeleaf 3.0.5的主要特性、如何在Spring Boot项目中集成以及一些常见的使用场景。 首先，Thymeleaf 3.0.5的核心特性包括： 1. **模板语言**：Thymeleaf提供了一种HTML友好的模板语言，...
在springboot中前端使用jsp相关代码实现及笔记
最新发布
06-12
在Spring Boot中集成JSP（JavaServer Pages）用于前端展示是一种常见的实践，尤其在传统的Web开发中。Spring Boot以其简洁的配置和快速的开发效率深受开发者喜爱，而JSP作为服务器端动态页面技术，能够方便地与Java...
spring_boot_mvc_e_thymeleaf:Curso Udemy Marcio Ballem
03-31
7. **扩展功能**：可能还会介绍如何使用Thymeleaf的高级特性，如片段、宏、表达式对象等，以及如何与其他技术（如Spring Security、WebSocket等）集成。 在【标签】"HTML"中，我们可以推测课程会涉及到HTML的基础...
一套基于模版的代码生成器
11-15
当用户输入必要的参数和信息后，代码生成器会根据模板生成相应的代码片段，生成的代码可以是单个文件，也可以是整个项目结构。这种方式使得开发者能够快速构建符合规范的代码，特别是在处理数据库模型、接口实现、...
如何在Thymeleaf 模板中使用片段Fragments
allway2的博客
10-19 1091
表示可包含在其他模板中的模板片段的片段。它可以是页眉，菜单，页脚和文档的任何其他部分，通常在许多页面上重复。片段可以参数化并包含在特定的初始参数中。在本文中，我们已经展示了百里叶中的模板布局机制是多么灵活。我们还可以将常用的逻辑分离到一个片段中，并将其附加到许多模板中。要使用参数化片段，我们需要提供一个片段名称和声明的参数列表。片段可以隔离在单独的文件中（我们建议使用此方法），也可以在任何其他模板中定义。在下面的示例中，我们定义了一个负责在 HTML 表中显示单个联系人行的片段。
Thymeleaf3 （四）模板布局
chiwangzuan0717的博客
11-01 174
在 WEB 应用开发中 ， 我们通常会将一些公共的代码片段如页眉 、 页脚 、 菜单等抽取出来放到一个或多个独立的文件里面 ， 其他模板文件可以通过标签轻松的将这些代码片段引用进来 ， 从而实现代码的复用性 。 在 Thymeleaf 中 ， 你可以使用 th:fragment 来定义一个公共...
Thymeleaf的List各类问题（后端接收对象集合）
chenjing928的博客
10-21 3847
需求是前端页面循环展示一个后端来的数据，并且前端循环的列表每个都有点击事件，需要把列表中的自己的id传入到触发事件中，最后提交的时候把循环列表的对象集合数据全部提交到后端。我使用的是SpringBoot+Thymeleaf，下面用代码一步步展示过程。
Thymeleaf的常用表达式及简单使用实例
kelsey1234的博客
09-04 5555
什么是Thymelaf？ 它是非常可拓展的。允许自定义名字来定义一组模板属性（或者甚至是标签） 它还带有一些称为标准方言的东西。它们定义了一组功能，这些功能满足大多数情况 标准表达式五种类型 ${…}：变量表达式 *{…}：选择表达式 #{…}：消息表达式（i18n） @{…}：链接表达式（URL） ~{…}：片段表达式 变量表达式： 作为属性： <span th:text="${b...
Thymeleaf 表达式工具类（#strings #dates #numbers #bools）
白洞，白色的明天在等着我们
08-24 1758
Thymeleaf 提供了丰富的表达式工具类，例如#strings、#dates、#numbers、#bools，感兴趣就点进来学习下吧(*^▽^*)~
SpringBoot学习之路---抽取并引用thymeleaf的公共代码片段
LeslieLau的博客
03-28 645
有时候我们在多个html页面中会使用到多个相同的组件，比如我们有自己开发过电商平台的话，我们就会知道导航条和侧边栏是经常被复用的，就会想到抽取公共的代码片段，抽取的方式有很多，这里介绍thymeleaf的抽取和引用的方式 我们在想要抽取的代码的标签上添加这个属性th:fragment="name" 例(抽取bootstarp的导航条): <!--导航条--> <nav clas...
thymeleaf学习笔记
weixin_30564901的博客
10-20 194
一、Spring Boot中指定静态资源和Thymeleaf模板文件地址时一定要使用路径分隔符结尾（linux：/，windows：\\），否则页面加载时访问不到模板文件，如：spring.resources.static-locations: classpath:/static/ 二、Thymeleaf 与 Javascript 在 javascript 代码中使用 Thymelea...
Thymeleaf抽取公共页面片段
天高任鸟飞
08-30 5859
抽取页面 项目中，一般把所有的公共页面片段都抽取出来 放在一个独立的页面中 其他，所有的页面根据需要进行引用 参考文档 th:fragment 抽取公共元素 Name，随便自定义命名 &lt;!DOCTYPE html&gt; &lt;html xmlns:th="http://www.thymeleaf.org"&gt; &lt;body&gt; &lt;div th:...
thymeleaf 引入公共代码片段 [THYMELEAF][http-nio-8080-exec-1] Exception processing template "admin/root": An
热门推荐
落叶无痕的博客
10-22 3万+
在用thylemeaf引入公共片段时， &lt;div th:replace="commons :: topnav"&gt;&lt;/div&gt; 报错  ERROR 3092 --- [nio-8080-exec-6] org.thymeleaf.TemplateEngine             : [THYMELEAF][http-nio-8080-exec-6] Exc...
spring-boot-starter-thymeleaf 代码报红
05-18
2. 如果你使用的是IntelliJ IDEA，可以在设置中开启Thymeleaf的语法高亮支持。具体操作为：打开IDEA的设置界面，搜索“Thymeleaf”，在“Thymeleaf”选项卡中勾选“Enable”选项即可。 3. 如果以上两种方法都无法...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值