在编写页面时，常常会需要用到通用模块，比如header部分、footer部分等。
项目前端使用的是themeleaf模板引擎，下面简单介绍下使用themeleaf写header通用模块：
1. 通用部分： header2.html
主要使用th:gragment属性标记
<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head th:fragment="common_header(title)">
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<title th:replace="${title}">head real</title>
</head>
<body>
<div class="header" style="height: auto;" th:fragment="header">
这是来自header模块的内容...
</div>
</body>
</html>
2. 引用部分：
主要使用th:relpace属性进行标记
headDemo01.html
<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>headDemo01</title>
</head>
<body>
<div th:replace="~{header2 :: header}"></div>
headDemo01
</body>
</html>
headDemo02.html
<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>headDemo02</title>
</head>
<body>
<div th:replace="~{header2 :: header}"></div>
headDemo02
</body>
</html>
时间： 2024-11-13 06:00:07