本文介绍了一个使用Freemarker实现的布局模板案例，详细展示了如何通过宏定义和变量赋值来构建网页的基本结构，包括引入CSS样式和JavaScript脚本等。
layout.ftl
<#assign REQ_URI=request.getRequestURI>
<#macro import_script></#macro>
<#macro import_css></#macro>
<#macro layout title>
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 300 1134
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>${title!"首页"} </title>
<#include "inc/favicon.ftl" />
<link rel="stylesheet" type="text/css" href="${REQ}/assets/plugins/layui/css/layui.css">
<link rel="stylesheet" type="text/css" href="${REQ}/assets/plugins/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="${REQ}/assets/css/app.css">
<@import_css />
</head>
<body>
<#nested>
<script type="text/javascript">window.BASE_URL = "${REQ}";</script>
<script type="text/javascript" src="${REQ}/assets/js/jquery.min.js"></script>
<script type="text/javascript" src="${REQ}/assets/plugins/layui/layui.js"></script>
<script type="text/javascript" src="${REQ}/assets/js/app.js"></script>
<@import_script />
</body>
</html>
</#macro>
页面
<#include "inc/layout.ftl" />
<#macro import_script>
<script type="text/javascript">
var apiurl="${apiurl}";
</script>
<script type="text/javascript">
</script>
<#include "inc/layout.ftl" />
<#macro import_script>
<script type="text/javascript">
</script>
</#macro>
<#macro import_css>
<style>
</style>
</#macro>
<@layout >
</@layout>
<#assign REQ_URI=request.getRequestURI>
<#macro import_script></#macro>
<#macro import_css></#macro>
<#macro layout title>
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 300 1134
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>${title!"首页"} </title>
<#include "inc/favicon.ftl" />
<link rel="stylesheet" type="text/css" href="${REQ}/assets/plugins/layui/css/layui.css">
<link rel="stylesheet" type="text/css" href="${REQ}/assets/plugins/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="${REQ}/assets/css/app.css">
<@import_css />
</head>
<body>
<#nested>
<script type="text/javascript">window.BASE_URL = "${REQ}";</script>
<script type="text/javascript" src="${REQ}/assets/js/jquery.min.js"></script>
<script type="text/javascript" src="${REQ}/assets/plugins/layui/layui.js"></script>
<script type="text/javascript" src="${REQ}/assets/js/app.js"></script>
<@import_script />
</body>
</html>
</#macro>
页面
<#include "inc/layout.ftl" />
<#macro import_script>
<script type="text/javascript">
var apiurl="${apiurl}";
</script>
<script type="text/javascript">
</script>
<#include "inc/layout.ftl" />
<#macro import_script>
<script type="text/javascript">
</script>
</#macro>
<#macro import_css>
<style>
</style>
</#macro>
<@layout >
</@layout>
扫一扫
1553
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
