Django模板继承实战：利用HTML模板复用代码
本文介绍如何在Django项目中通过HTML模板继承机制减少代码冗余。通过创建base.html基础模板，利用{% block %}标签定义可替换区域，并在index.html和detail.html中通过{% extends %}继承该模板，实现页面结构的复用。文章提供了具体的模板代码示例及官方文档参考，帮助开发者优化Django视图与模板的协作方式。
观察以下两个页面示例：
其中一个是文章列表页，另一个是文章详情页，这两个页面包含部分相同的内容，存在可以复用的代码片段。
针对此案例，我们可以配置三个HTML文件：用于复用的基础部分、列表页面部分以及详情页面部分。
首先是复用部分：
base.html
<!DOCTYPE html>
<!DOCTYPE html>
<html lang="zh-CN">
{% load staticfiles %}
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>首页</title>
<script type="text/javascript" src="{% static "bootstrap/js/jquery-2.0.0.min.js" %}"> </script>
<script type="text/javascript" src="{% static "bootstrap/js/jquery-ui.js" %}"></script>
<link href="{% static " rel="external nofollow" bootstrap/css/bootstrap-combined.min.css" %}" rel="stylesheet" media="screen" >
<script type="text/javascript" src="{% static "bootstrap/js/bootstrap.min.js" %}"s></script>
</head>
<body>
<div class="container-fluid" id="LG">
<div class="row-fluid">
<img src="{% static "img/head1.png" %}" alt="返回主页">
<div class="span12" >
</div>
</div>
<div class="row-fluid">
<div class="span2">
</div>
<div class="span6">
<ul class="nav nav-tabs">
<li class="active">
<a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" >首页</a>
</li>
<li>
<a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" >资料</a>
</li>
<li >
<a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" >信息</a>
</li>
</ul>
{% block context %}
添加内容
{% endblock context %}
</div>
<div class="span4">
</div>
</div>
</div>
</body>
</html>
在模板中使用{% block context %}{% endblock context %}标签，以便在不同子页面中插入各自特有的内容。
接着是列表部分：
index.html
{% extends "blog/base.html" %}
{% block context %}
{% if latest_article_list %}
<ul>
{% for article in latest_article_list %}
<li>
<a href="{% url 'blog:detail' article.id %}" rel="external nofollow" >
{{ article.title }} </a>
</li>
{% endfor %}
</ul>
{% else %}
<p>No articles are available.</p>
{% endif %}
{% endblock context %}
通过{% extends "blog/base.html" %}语句加载模板文件，该模板文件的路径是相对于templates目录的相对路径。
最后是详情部分：
detail.html
{% extends "blog/base.html" %}
{% block context %}
<h1>{{ article.title }}</h1>
<p>{{ article.content }}</p>
{% endblock context %}
Django官方文档地址：http://python.usyiyi.cn/django_182/ref/templates/language.html
总结
以上内容即为关于Django使用HTML模板减少代码复用的完整解析，希望能对大家有所帮助。感兴趣的朋友还可以继续阅读本站的其他文章：
浅谈Django REST Framework限速
Django admin美化插件suit使用示例
Django admin实现图书管理系统菜鸟级教程完整实例
如果内容存在不足之处，欢迎留言指正。感谢各位朋友对本站的支持！
免责声明：本文内容仅供参考，不代表本站观点。转载或引用请注明出处。
