一、模板繼承
Django 使用了“模板繼承”的概念：這就是 {% extends "base.html" %}所做的事。它意味着 “首先載入名爲 ‘base’ 的模板中的內容到當前模板，然後再處理本模板中的其餘內容。”總之，模板繼承讓你在模板間大大減少冗餘內容：每一個模板只需要定義它獨特的部分即可。
在項目中一個頁面需要修改還好，那麼如果當多處並且多個頁面都需要修改，那麼就大大增加工作量。當時當多個頁面中多存在相同的部分，使用模板繼承就大大減少開發和維護人員的壓力。在模板繼承中，父模板中放置大部分子模板共用的且不變的內容，在每一個字模板中可以重寫父模板中內容
1、應用
典型應用就是在網站開頭或者網站結尾處。
2、說明
- 如果在模版中使用extends標籤，它必須是模版中的第一個標籤
- 不能在一個模版中定義多個相同名字的block標籤
- 子模版不必定義全部父模版中的blocks，如果子模版沒有定義block，則使用了父模版中的默認值
- 如果發現在模板中大量的複製內容，那就應該把內容移動到父模板中
- 使用可以獲取父模板中block的內容
- 爲了更好的可讀性，可以給endblock標籤一個名字
3、三級繼承
- 三層繼承結構使代碼得到最大程度的複用，並且使得添加內容更加簡單
- 部分電商網站的頁面結構
二、實例
1、創建根級模板
- 名稱爲“base.html”
- 存放整個站點共用的內容
<!DOCTYPE html>
<html>
<head>
<title>{% block title %}{% endblock title %} </title>
<link rel="stylesheet" type="text/css" href="/static/css/style.css">
{% block custom_css %}{% endblock custom_css %}
</head>
<body>
{% block left %}{% endblock left%}
{% block content %}{% endblock content %}
</body>
<script src="/static/js/jquery.min.js" type="text/javascript"></script>
{% block cutsom_js %}{% endblock custom_js %}
</html>
另外: 爲了保證瀏覽器的頁面加載進度儘可能不影響用戶的瀏覽體驗，JavaScript文件通常放在dom樹的最後分支
2、 創建分支模板
home.html
- 繼承base.html
{% extend 'base.html' %}
{% block titlt %}生鮮超市{% endblock title %}
{% block custom_css %}
<link rel="stylesheet" type="text/css" href=" /static /css/reset.css">
{% endblock custom_css %}
{% block left %}
<p>左側菜單欄</p>
{% endblock left%}
{% block content %}
<p>中央內容</p>
{% endblock content %}
{% block cutsom_js %}
<script src="/static/js/jquery-migrate-1.2.1.min.js" type="text/javascript"></script>
{% endblock custom_js %}
那麼最後的home.html爲
<!DOCTYPE html>
<html>
<head>
<title>生鮮超市</title>
<link rel="stylesheet" type="text/css" href="/static/css/style.css">
<link rel="stylesheet" type="text/css" href=" /static /css/reset.css">
</head>
<body>
<p>左側菜單欄</p>
<p>中央內容</p>
</body>
<script src="/static/js/jquery.min.js" type="text/javascript"></script>
<script src="/static/js/jquery-migrate-1.2.1.min.js" type="text/javascript"></script>
</html>