大纲
我们都知道html模板中，很多内容都是有重复的，譬如前面的head和后面的footer部分，这里的部分都是重复的，我们可以通过今天的学习的技术，减少代码的使用量，避免重复。
- 宏
- include
- 模板继承
宏
宏的使用方法很类似于函数的使用。首先我们新建一个html文件。
{% macro test(fruit)%}
<li>{{ fruit }}</li>
{% endfor %}
这样我们在index.html中就可以这样来写：
{% import 'macros.html' as macros %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>罗罗攀</title>
</head>
<body>
<ul>
{% for fruit in fruits %}
{{ macros.test(fruit) }}
{% endfor %}
</ul>
</body>
</html>
include
大量重复代码，可以使用include方法，我们新建一个common.html文件，用于存放共有代码。
<div>
<a href="#">首页</a>
<a href="#">详情页</a>
<a href="#">个人中心</a>
</div>
然后在index.html就可以使用：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>罗罗攀</title>
</head>
<body>
{% include 'common.html' %}
</body>
</html>
模板继承
在大型网站中，常用到模板继承。我们首先新建一个base.html文件。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>罗罗攀</title>
</head>
<body>
<div>
<a href="#">首页</a>
<a href="#">详情页</a>
<a href="#">个人中心</a>
</div>
{% block body %}{% endblock %}
</body>
</html>
然后在index中，就可以少写很多代码了。
{% extends 'base.html' %}
{% block body %}
<h1>hello</h1>
{% endblock %}
网友评论