引入公共片段

引入公共片段的th属性,包括三种方式

th:insert

将公共片段,整个插入到声明引入的元素中

th:replace

将声明引入的元素,替换为公共片段

th:include

将被引入的片段的内容,包含进这个标签中

抽取公共片段

 <footer th:fragment="copy">
&copy; 2011 The Good Thymes Virtual Grocery
</footer>

引入方式

 <div th:insert="footer :: copy"></div>
<div th:replace="footer :: copy"></div>
<div th:include="footer :: copy"></div>

页面效果

 <div>
<footer>
&copy; 2011 The Good Thymes Virtual Grocery
</footer>
</div> <footer>
&copy; 2011 The Good Thymes Virtual Grocery
</footer> <div>
&copy; 2011 The Good Thymes Virtual Grocery
</div>

注意

引入语法~{} 
波浪线、花括号可以写,可以不写

但是,在行内写法中[[~{}]]、[(~{})] 
必须,加上~{}

参考:https://blog.csdn.net/nangeali/article/details/82215708

Thymeleaf引入公共片段方式的更多相关文章

  1. thymeleaf引入公共css、js

    有时候很多css文件是公共的,我们必须要在每个html文件中引入它们,其实我们可以利用Thymeleaf的模板布局,把这些css文件抽出来,同时如果有某个html文件专属的css文件,还可在引入模板的 ...

  2. thymeleaf 引入公共html注意事项

    详细连接https://blog.csdn.net/u010260737/article/details/83616998 每个页面都会用到分页.html或者头部.html.尾部.html,在其他页面 ...

  3. th:insert、th:replace、th:include抽取和引用页面公共片段、传参等

    一.抽取公共片段 th:fragment  给片段命名 将公共片段抽取出来,并在顶级标签内使用th:fragment给该片段命名. 例如:将公共片段抽取出来放到comment/bar.html中: & ...

  4. 基于 Webpack 引入公共库的几种方式

    以 jquery 和其插件 jquery-modal 为例,记录下引入公共库的几种方式. 为了方便,首先安装 jquery 和 jquery-modal: cnpm i jquery jquery-m ...

  5. ThinkPHP5——引入公共部分head和foot(多种方法)

    在项目中,header和footer重复使用的次数高,于是我们把header和footer作为公共部分,其他模板需要的话就引用.下面我教大家引用公共模板 1.使用include 首先在view下面新建 ...

  6. asp.net开发中常见公共捕获异常方式总结(附源码)

    本文实例总结了asp.net开发中常见公共捕获异常方式.分享给大家供大家参考,具体如下: 前言:在实际开发过程中,对于一个应用系统来说,应该有自己的一套成熟的异常处理框架,这样当异常发生时,也能得到统 ...

  7. thinkphp5引入公共部分header、footer等

    由于用惯了tp3.2,改用tp5有些还是感觉别扭的 直接上问题:项目中需要用到引入公共导航.头部.底部.右边部分等等 首先要弄清楚thinkphp5的配置项是哪个文件,众所周知:config.php, ...

  8. js进阶ajax函数封装(匿名函数作为参数传递)(封装函数引入文件的方式非常好用)

    js进阶ajax函数封装(匿名函数作为参数传递)(封装函数引入文件的方式非常好用) 一.总结 2.匿名函数作为参数传递 二.js进阶ajax函数封装 ajax1.js function ajax(ur ...

  9. vue 引入公共css文件

    1.在入口js文件main.js中引入,一些公共的样式文件,可以在这里引入. import Vue from 'vue'import App from './App' // 引入App这个组件impo ...

随机推荐

  1. (贪心 模拟?) codeVs1098 均分纸牌

    题目描述 Description 有 N 堆纸牌,编号分别为 1,2,…, N.每堆上有若干张,但纸牌总数必为 N 的倍数.可以在任一堆上取若于张纸牌,然后移动. 移牌规则为:在编号为 1 堆上取的纸 ...

  2. [Luogu 1262] 间谍网络

    题目描述 由于外国间谍的大量渗入,国家安全正处于高度的危机之中.如果A间谍手中掌握着关于B间谍的犯罪证据,则称A可以揭发B.有些间谍收受贿赂,只要给他们一定数量的美元,他们就愿意交出手中掌握的全部情报 ...

  3. go的net/http用法

    http包提供了HTTP客户端和服务端的实现 一:http客户端的几种方法 1. func (c *Client) Get(url string) (resp *Response, err error ...

  4. mysql批量插入简单测试数据

    mysql批量插入简单测试数据 # 参考网址: https://www.2cto.com/database/201703/618280.html 1.mysql创建测试表 CREATE TABLE ` ...

  5. zTree基础

    zTree使用 zTree 是一个依靠 jQuery 实现的多功能 “树插件”, 而且拥有较好的浏览器兼容性,有着丰富的功能以及可以自定义样式,足以满足大部分业务的开发. 第一步先导入css及js文件 ...

  6. 获取日k数据

    http://web.ifzq.gtimg.cn/appstock/app/fqkline/get?_var=kline_dayqfq&param=sz002921,day,,,320,qfq ...

  7. jmeter jsr223脚本引用变量的问题

    发现jmeter的一个问题不知道算不算bug. 具体表现为,在脚本中通过"${varName}"的方式引用前面使用vars.put("varName",&quo ...

  8. 剑指Offer_编程题_2

    题目描述 请实现一个函数,将一个字符串中的空格替换成“%20”.例如,当字符串为We Are Happy.则经过替换之后的字符串为We%20Are%20Happy.   class Solution ...

  9. Zookeeper+Kafka完全分布式实战部署

    Zookeeper+Kafka完全分布式实战部署 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 其实我之前部署过kafak和zookeeper的完全分布式,集群是可以正常使用没错, ...

  10. Flink HA 搭建坑

    目前网上能找到的做HA的教程基本都无法真正做到多机高可用,包括官方文档,经过很久的折腾,终于做到了多机高可用,希望其它人不再被坑. 集群模式安装 前提条件: 机器已经安装好Java环境 jobMana ...