【SpringBoot学习】02-th:replace与th:insert详解

声明公共代码片段

通过th:fragment

  <div th:fragment="header_common">

    <p>这是fragment公共片段</p>
    
   </div>

通过id声明代码片段

   <div id="header_common_id">

      <p>这是id公共片段</p>

   </div>

替换/插入

使用th:replace 通过th:fragment

<div th:replace="header :: header_common"></div>

使用th:replace 通过id

 <div th:replace="header :: #header_common_id"></div>

使用th:insert 通过id

<h2  th:insert="header :: #header_common_id"></h2>

th:replace与th:insert区别

th:insert 和 th:replace都可以引入片段
两者的区别在于:
th:insert: 保留引入时使用的标签
th:replace:不保留引入时使用的标签,直接覆盖当前引用的标签

实操

在这里插入图片描述

可以使用id的方法

在这里插入图片描述

根据不同的场景使用不同的id内容 实现动态改变页面某一属性

在这里插入图片描述

头部使用公共代码

在这里插入图片描述

通过activeUri 的 id 和配置公共区域代码的 id 进行比对 来确定 id 后的值 从而动态实现不同的样式

在这里插入图片描述

发布了44 篇原创文章 · 获赞 7 · 访问量 853

猜你喜欢

转载自blog.csdn.net/ange2000561/article/details/104649441
th
今日推荐