Django中模板的继承及引用实现
引言
大家啊可以随便取找个网站，比如：淘宝。多去看看它不同的页面，用你闪亮的大眼睛去找不同点和相同点。
到一定时候，你会发现，网站中有些不同的页面，它们中的部分数据是完全一模一样的；而且有些数据不一样的部分，它们前端的排版格式却是一模一样的哦！
你肯定会心生疑问——难道这些页面全都要一个个敲代码做嘛！这也太绝望了吧！！！
但是——不要忘记了！程序猿一大原则是：绝不做重复的事！
所以对于上述现象，就涉及到了一个知识点——模板的继承与引用！！！
1.模板的继承与引用
Django模版引擎中最强大也是最复杂的部分就是模版继承了。 模版继承可以让你创建一个基本的“骨架”模版，它包含您站点中的全部元素，并且可以定义能够被子模版覆盖的 blocks 。
（1）第一部分：常规思想——每个前端页面都单独码：（下面示范三个前端页面，对应三个html模板文件及其效果展示！）
①第一个html模板：
a_first.html文件：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
*{
margin: 0;
padding: 0;
}
.top{
height: 200px;
background: darkgoldenrod;
}
.con{
height: 500px;
background: aqua;
}
.but{
height: 150px;
background: sandybrown;
}
</style>
</head>
<body>
<div>
<div class="top">头部</div>
<div class="con">内容一</div>
<div class="but">底部</div>
</div>
</body>
</html>
效果展示：
②第二个html模板：
a_second.html文件：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
*{
margin: 0;
padding: 0;
}
.top{
height: 200px;
background: darkgoldenrod;
}
.con{
height: 500px;
background: aqua;
}
.but{
height: 150px;
background: sandybrown;
}
.con .left{
width: 70%;
float: left;
height: 100%;
background: red;
}
.con .right{
width: 30%;
float: left;
height: 100%;
background: #352fff;
}
</style>
</head>
<body>
<div>
<div class="top">头部</div>
<div class="con">
<div class="left">内容二</div>
<div class="right">广告</div>
</div>
<div class="but">底部</div>
</div>
</body>
</html>
效果展示：
③第三个html模板：
a_third.html文件：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
*{
margin: 0;
padding: 0;
}
.top{
height: 200px;
background: darkgoldenrod;
}
.con{
height: 500px;
background: aqua;
}
.but{
height: 150px;
background: sandybrown;
}
.con .left{
width: 70%;
float: left;
height: 100%;
background: #f338ff;
}
.con .right{
width: 30%;
float: left;
height: 100%;
background: #24ff44;
}
</style>
</head>
<body>
<div>
<div class="top">头部</div>
<div class="con">
<div class="left">内容三</div>
<div class="right">广告</div>
</div>
<div class="but">底部</div>
</div>
</body>
</html>
效果展示：
分析——不难看出，这三个前端界面头部和底部是一模一样的；后两个的中间内容部分右侧也都是广告页面。而我们为了实现这三个html界面分别码了那么多重复的代码，费时费力，考虑到类可以继承，那么咱的html模板能否继承呢？ 答案是肯定的，下面咱们来使用模板的继承看一看有多牛逼：
（2）第二部分：高级思想——使用模板的继承及引用！
①编写父级模板base.html：
编写父级模板原则：相同的部分直接编写代码，使子模板直接继承（模板继承使用extends标签实现）；不同的部分通过使用block来给子模板开放接口，使子模板可以进行覆写（模板覆写使用block标签实现）
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
*{
margin: 0;
padding: 0;
}
.top{
height: 200px;
background: darkgoldenrod;
}
.con{
height: 500px;
background: aqua;
}
.but{
height: 150px;
background: sandybrown;
}
.con .right{
width: 30%;
float: left;
height: 100%;
background: #352fff;
}
</style>
{% block style %}{% endblock %} {#让子模板可以对css样式进行覆写！#}
</head>
<body>
<div>
<div class="top">头部</div>
<div class="con">
{% block con %}
{% block left %}
{% endblock %}
{% block right %}
<div class="right">广告</div>
{% endblock %}
{% endblock %}
</div>
<div class="but">底部</div>
</div>
</body>
</html>
②第一个html模板： a_first.html文件：
{% extends 'music/base.html' %}
{% block con %}
内容一
{% endblock %}
②第二个html模板：
a_second.html文件：
{% extends 'music/base.html' %}
{% block style %}
<style>
.con .left{
width: 70%;
float: left;
height: 100%;
background: red;
}
</style>
{% endblock %}
{% block left %}
<div class="left">内容二</div>
{% endblock %}
②第三个html模板： a_third.html文件：
{% extends 'music/base.html' %}
{% block style %}
<style>
.con .left{
width: 70%;
float: left;
height: 100%;
background: #f338ff;
}
.con .right{
width: 30%;
float: left;
height: 100%;
background: #24ff44;
}
</style>
{% endblock %}
{% block left %}
<div class="left">内容三</div>
{% endblock %}
（3）使用模板的继承及引用实现会发现跟上面不使用的效果一模一样！！！而且咱的代码简洁太多 。
下面来总结一下模板的继承及引用：
模板继承使用extends标签实现。通过使用block来给子模板开放接口。
- extends必须是子模板中第一个出现的标签。
- 子模板中的所有内容，必须出现在父模板定义好的block中，否则django将不会渲染。
- 如果出现重复代码，就应该考虑使用模板。
- 尽可能多的定义block，方便子模板实现更细的需求。
- 如果在某个block中，要使用父模板的内容，使用block.super获取。
到此这篇关于Django中模板的继承及引用实现的文章就介绍到这了,更多相关Django模板的继承及引用内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！
相关推荐
-
详解Django项目中模板标签及模板的继承与引用(网站中快速布置广告)
Django项目中模板标签及模板的继承与引用 常见模板标签 {% static %} {% for x in range(x) %}{% endfor %} 循环的序号{% forloop %} 循环的序号反向排列,从1开始计算,从0开始计算在后面加上0{% forloop.revcounter0 %} {% if condition1 %}sentence1{% else condition2 %}sentence2{% endif %} 模板标签url反向解析 视图函数 def studen
-
Django中模板的继承及引用实现
引言 大家啊可以随便取找个网站,比如:淘宝.多去看看它不同的页面,用你闪亮的大眼睛去找不同点和相同点. 到一定时候,你会发现,网站中有些不同的页面,它们中的部分数据是完全一模一样的:而且有些数据不一样的部分,它们前端的排版格式却是一模一样的哦! 你肯定会心生疑问--难道这些页面全都要一个个敲代码做嘛!这也太绝望了吧!!! 但是--不要忘记了!程序猿一大原则是:绝不做重复的事! 所以对于上述现象,就涉及到了一个知识点--模板的继承与引用!!! 1.模板的继承与引用 Django模版引擎中最强大也是
-
django中模板继承与ModelForm实例详解
目录 模板的继承 form和ModelForm 使用方法 总结 模板的继承 完美在写html的时候会发现,自己多个html文件中又好多东西是一样的,包括静插件的引入 还有有些简单的css样式都不需要修改,这样完美就可以引入有关模板来方便操作 {% load static %} <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title
-
django中模板的html自动转意方法
一.需求来源: 如果用户在文本框中填了一段<script>alert(xxx);</script>代码,然后我们还保存在了数据库中,下次模板加载数据的时候,将这段代码显示在浏览器,将会弹出一个警告框.因此,这是XSS(跨域脚本)攻击的一种方式,我们肯定不能允许这种事件发生,因此django默认给我们启动了自动转意的功能.将这段代码转换成普通的文本进行展示. 二.如何关闭: 你肯定会问既然自动转意可以关闭XSS漏洞为什么需要关闭呢?原因很简单,如果你数据库中保存了一段可信任的HTML
-
如何优雅地改进Django中的模板碎片缓存详解
前言 本文主页给大家介绍了关于如何改进Django中模板碎片缓存的相关内容,关于Django模板碎片缓存大家可以先看看这篇文章,下面话不多说了,来一起看看详细的介绍吧 起步 Django 的缓存体系提供了模板片段缓存: {% load cache %} {% cache 500 sidebar %} .. sidebar .. {% endcache %} 但使用这个模板缓存还是需要每次都把需要的变量 sidebar 传给模板,不然当缓存过期时碎片是空白的.于是就需要的视图中获取这些数据: de
-
Python Django框架介绍之模板标签及模板的继承
一.标签语法 由%}和 {% 来定义的,例如:{%tag%} {%endtag%},完整的标签有开始就有结束,如条件语句,有条件判断的开始,也对应有条件的结束. 二.常见标签 if条件判断 if/elif/else:可以使用and/or/in/not/==/!=/<=/>=,来进行判断.ifequal/ifnotequal for循环 for ... in ...:和python中的用法一样. forloop.counter:当前迭代的次数,下标从1开始.1,2,3.... forloop.c
-
详解Python的Django框架中的模版继承
在实际应用中,你将用 Django 模板系统来创建整个 HTML 页面. 这就带来一个常见的 Web 开发问题: 在整个网站中,如何减少共用页面区域(比如站点导航)所引起的重复和冗余代码? 解决该问题的传统做法是使用 服务器端的 includes ,你可以在 HTML 页面中使用该指令将一个网页嵌入到另一个中. 事实上, Django 通过刚才讲述的 {% include %} 支持了这种方法. 但是用 Django 解决此类问题的首选方法是使用更加优雅的策略-- 模板继承 . 本质上来说,模板
-
Django框架模板语言实例小结【变量，标签，过滤器，继承，html转义】
本文实例讲述了Django框架模板语言.分享给大家供大家参考,具体如下: 模板语言 模板语言简称为DTL(Django Template Language) 模板变量 模板变量名由数字,字母,下划线和点组成,不能以下划线开头. 使用:{{模板变量名}} def index2(request): '''模板加载顺序''' return render(request, 'booktest/index2.html') # /temp_var def temp_var(request): '''模板变量
-
Django框架下静态模板的继承操作示例
本文实例讲述了Django框架下静态模板的继承操作.分享给大家供大家参考,具体如下: 前言:第一篇博客,毕业校招在即,抽空把做过的项目都整理一下. 开发环境:python3.4,django1.8 初入python和django做项目,遇到很多前端页面代码冗余的情况,特别是头部和脚部,代码都是一样的.最开始是代码一直复制粘贴,后来发现Django自带的模板继承很好用.本人新手,仅发表个人经验,确实觉得很受用.欢迎大家指导. ①. 定义一个基础模板,该框架之后由子模板继承. 命名为base.htm
-
django框架模板中定义变量(set variable in django template)的方法分析
本文实例讲述了django框架模板中定义变量的方法.分享给大家供大家参考,具体如下: 总有一些情况,你会想在django template中设置临时变量,但是django 对在模板中对临时变量的赋值没有很好的开箱即用的tag 或者filter.但是还是能通过一些其他方法实现的. 1. 利用 django 自带的 with 标签实现 2. 利用自定义 tag 实现,应该灵活很多. 利用 django 自带的 with 标签实现对变量赋值 好像在django 1.3 之后才支持这种做法 从cont