django模板自定义（详解Django项目中模板标签及模板的继承与引用网站中快速布置广告）

时间：2021-10-27 10:47:40类别：脚本大全

django模板自定义

详解Django项目中模板标签及模板的继承与引用网站中快速布置广告

django项目中模板标签及模板的继承与引用

常见模板标签

1

2

3

4

5 {% static %}

{% for x in range(x) %}{% endfor %}

循环的序号{% forloop %}

循环的序号反向排列,从1开始计算，从0开始计算在后面加上0{% forloop.revcounter0 %}

{% if condition1 %}sentence1{% else condition2 %}sentence2{% endif %}

模板标签url反向解析

视图函数

1

2

3

4

5

6

7

8

9

10

11

12 def student_detail_view(request,pk):

students = {

1:{'id':1,'name': '小明', 'age': 18, 'sex': '男'},

3:{'id':3,'name': '小花', 'age': 17, 'sex': '女'},

19:{'id':19,'name': '小李', 'age': 18, 'sex': '男'},

100:{'id':100,'name': '小红', 'age': 18, 'sex': '女'},

}

if pk in students:

student = students[pk]

else:

student = '查无此人'

return render(request,'teacher/student_detail.html',context={'student':student})

url反向解析应用模板

1

2

3

4

5

6

7

8

9

10 <tbody>

{% for student in students %}

<tr {% if student.sex == '女' %}style="background-color: pink"{% else %}style="background-color: aqua"{% endif %}>

<td><a href="{% url 'teacher:student_detail' student.id %}">{{ student.id }}</a></td>

<td>{{ student.name }}</td>

<td>{{ student.age }}</td>

<td>{{ student.sex }}</td>

</tr>

{% endfor %}

</tbody>

学生详情页：

1

2

3

4

5

6

7

8

9

10

11 <!doctype html>

<html lang="en">

<head>

<meta charset="utf-8">

<title>title</title>

</head>

<body>

学生详情页：

{{ student }}

</body>

</html>

模板的继承与引用

为什么要有模板的继承与引用？

学前端的时候写的页面比较复杂，每个页面都有相同的地方。

模板的继承

首先，新建一个父类页面。 挖好坑1和坑2。

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31 {% load static %}

<!doctype html>

<html lang="zh-cn">

<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>{% block title %}{% endblock %}</title>



<link href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" rel="stylesheet">







</head>

<body>



{% block content %}{% endblock %}



<script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"></script>



<script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script>

</body>

</html>

其次，子类页面的继承。

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25 {% extends 'teacher/base.html' %}

{% block title %}学生列表{% endblock %}

{% block content %}

<h1>学生列表</h1>

<table class="table">

<thead>

<tr>

<th>id</th>

<th>姓名</th>

<th>年龄</th>

<th>性别</th>

</tr>

</thead>

<tbody>

{% for student in students %}

<tr {% if student.sex == '女' %}style="background-color: pink"{% else %}style="background-color: aqua"{% endif %}>

<td><a href="{% url 'teacher:student_detail' student.id %}">{{ student.id }}</a></td>

<td>{{ student.name }}</td>

<td>{{ student.age }}</td>

<td>{{ student.sex }}</td>

</tr>

{% endfor %}

</tbody>

</table>

{% endblock %}

最终效果展示：

django模板自定义（详解Django项目中模板标签及模板的继承与引用网站中快速布置广告）

attention：

一般情况一层继承就够了，多层继承不好，因为容易出错
模板的继承要先在父类页面挖坑，子类页面可以填坑

模板的引用

首先，创建一个被引用的广告页面

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31 <!doctype html>

<html lang="en">

<head>

<meta charset="utf-8">

<title>title</title>

<style>

a{

text-decoration: none;

position: fixed;

bottom: 0;

}

</style>

</head>

<body>

<h1><a href="https://www.baidu.com/" id="ad">这是一个广告！不要点不要点</a></h1>

<script>

var h = document.getelementbyid('ad');

var color = 'blue';

function change_color() {

if(color == 'blue'){

color = 'red';

}else{

color = 'blue';

}

h.style.color = color;

settimeout('change_color()',500)

}

change_color()

</script>

</body>

</html>

其次，在页面中引用被引用的页面。

这里我们是在一个父类页面中引用的被引用页面

关键代码是下面的引用语句

1	`{%` `include` `'teacher/ad.html'` `%}`

详细代码如下：

{% load static %}

<!doctype html>

<html lang="zh-cn">

<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>{% block title %}bootstrap{% endblock %}</title>

{% include 'teacher/ad.html' %}

<link href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" rel="stylesheet">

<!--[if lt ie 9]>

<script src="https://cdn.jsdelivr.net/npm/html5shiv@3.7.3/dist/html5shiv.min.js"></script>

<script src="https://cdn.jsdelivr.net/npm/respond.js@1.4.2/dest/respond.min.js"></script>

<![endif]-->

</head>

<body>

{% block content %}

{% endblock %}

<script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"></script>

<!-- 加载 bootstrap 的所有 javascript 插件。你也可以根据需要只加载单个插件。 -

标签：模板 标签 引用 继承 django   
      
        
        
        上一篇下一篇
        
        猜您喜欢
        
        
          
              dedecms模板特点（为DedeCMS换上精美多样的提示信息窗口）
              织梦标签怎么设置网站（织梦模板DEDECMS文章页实现让用户选择字体大小的代码的方法）
              织梦后台参数怎么设置才符合seo（详解织梦模板自定义表单限制IP24小时只能提交一次教程）
              dedecms添加模板（dedecms正文自动排版插件 伪原创站必备）
              dedecms模板照片（DEDECMS首页调用图片集里的多张图片）
              dede源码如何新增页面（dedecms 在内容模板里调用栏目内容即{dede:field.content/}）
              dedecms本地搭建（dedecms blog博客模板安装说明）
              python图片模板匹配（python实现简单图片物体标注工具）
              dedecms创建栏目（dedecms织梦模板栏目列表中添加统计文档数量的标签）
              laravel后台管理（关于laravel后台模板laravel-admin select框的使用详解）
              新一小兰领衔 盘点动漫中的那些 远距离恋爱情侣（盘点动漫中的那些）
              大事件 合肥四中火了（大事件合肥四中火了）
              翼龙贷组织出借人调研 感受鄱阳 借 来的致富路（翼龙贷组织出借人调研）
              2023新国风戏曲教育寒假集训班汇报演出《戏娃闹元宵》图文报道（2023新国风戏曲教育寒假集训班汇报演出戏娃闹元宵图文报道）
              九儿《狐踪谍影》出演热血女特警，戏份杀青受关注（九儿狐踪谍影出演热血女特警）
              红色代表什么（红色代表什么寓意）
              
       
        
         热门推荐
           
            
                1虚拟服务器和云主机的区别（云服务器属于虚拟机么？它们有什么不同？）
                2SQL Server变量
                3python 百度搜索结果（Python模拟百度自动输入搜索功能的实例）
                4mysql主从复制步骤（MySQL8 主从复制踩坑指南）
                5mysql8.0.20安装教程图解（mysql 8.0.24 安装配置方法图文教程）
                6python socket 设置通信协议（详解python中TCP协议中的粘包问题）
                7django框架详解（Django如何开发简单的查询接口详解）
                8docker镜像创建教程（Docker镜像加载原理）
                
      
    

© 2021 开心学习