13.2.4 模板层——模板语言

Django约定将所有的HTML文档都放在templates文件夹下，注意，templates是模板的意思，这是因为放在templates文件夹下的并不全是HTML文档，如果文档中包含Django的模板语言，那就是Django模板文件。

来思考一个响应的过程，当我们使用render()函数返回一个文档时，并不是读取HTML文档的内容然后直接返回，而是要做一层渲染。

比如我们之前见过的{% %}语法，其实就是一种渲染，将包含的内容替换为Python变量。

我们知道，操作数据库是后端做的事情，也就是在Python的Django中通过Model层操作数据库。

编写Python代码和设计制作模板同时进行效率才是最高的，但是Python代码编写和HTML设计是两项不同的工作，大多数专业的网站开发环境都将这两项工作分配给不同的部门不同的人员完成。

基于这些原因，将页面设计和Python代码分离开会更干净简洁，更容易维护，但是前端又需要后端的数据，这时候就需要使用Django的模板系统（Template System）来实现这种需求。

模板语法变量

我们在blog > urls.py中定义博客主页的映射关系：

from django.urls import path
from blog import views

# URL控制器
urlpatterns = [
    # 博客系统主页
    path('index/', views.index),
    # 匹配年份
    path('<year>/', views.year_view),
    # 匹配年月
    path('<int:year>/<int:month>/', views.month_view),
    # 匹配年月日
    path('<int:year>/<int:month>/<int:day>/', views.day_view),
]

然后在blog>views.py中定义一些变量：

def index(request):
	# 测试字符串
	name = 'Alex'
	# 测试时间
	register_time = datetime.date(2020, 3, 8)
	# 测试列表
	course = ['语文', '数学', '英语']
	# 测试字典
	info = {
		'nickname': 'AlexKing',
		'age': 18,
		'major': 'AI and Big Data'
	}

	# 测试对象
	class Person:
		def __init__(self, nickname, age):
			self.nickname = nickname
			self.age = age

	Alex = Person('alex', '18')
	Coco = Person('coco', '18')
	Bei = Person('bei', '3')
	person_list = [Alex, Coco, Bei] 

	return render(request, 'blog.html', locals())

之后在HTML文档中通过模板语法获取这些变量：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Matrix Blog</title>
</head>
<body>
    <h1>测试字符串:{{ name }}</h1>
    <hr>
    <h1>测试时间:{{ time }}</h1>
    <hr>
    <h1>测试列表:{{ course }}</h1>
    <h1>测试列表:{{ course.0 }}</h1>
    <h1>测试列表:{{ course.1 }}</h1>
    <hr>
    <h1>测试字典:{{ info }}</h1>
    <h1>测试字典:{{ info.nickname }}</h1>
    <h1>测试字典:{{ info.age }}</h1>
    <hr>
    <h1>测试对象:{{ Alex }}</h1>
    <h1>测试对象:{{ Coco.nickname }}</h1>
    <h1>测试对象:{{ Bei.age }}</h1>
</body>
</html>

显示效果为：

在这里插入图片描述

模板之过滤器

语法：

{{obj|filter__name:param}}

default:

如果一个变量是false或者为空，使用给定的默认值。否则，使用变量的值。

length:

返回值的长度。它对字符串和列表都起作用。

date:

时间操作。

slice:

切片。

truncatechars:

如果字符串字符多于指定的字符数量，那么会被截断。截断的字符串将以可翻译的省略号序列（“…”）结尾。

safe:

Django的模板中会对HTML标签和JS等语法标签进行自动转义，原因显而易见，这样是为了安全。

但是有的时候我们可能不希望这些HTML元素被转义，比如我们做一个内容管理系统，后台添加的文章中是经过修饰的，这些修饰可能是通过一个类似于FCKeditor编辑加注了HTML修饰符的文本，如果自动转义的话显示的就是保护HTML标签的源文件。

为了在Django中关闭HTML的自动转义有两种方式，如果是一个单独的变量我们可以通过过滤器“|safe”的方式告诉Django这段代码是安全的不必转义。

blog>views.py:

	# 测试过滤器
	date_test = datetime.datetime.now()
	slice_test = 'Alex Love Coding'
	truncatechars_test = 'Alex Love Coding, he want to learn more.'
	safe_test = '<a href="www.baidu.com">百度一下</a>'

templates>blog.html:

    <h1>过滤器 default:{{ info|default:'nothing' }}</h1>
    <h1>过滤器 info length:{{ info|length }}</h1>
    <h1>过滤器 person_list length:{{ person_list|length }}</h1>
    <h1>过滤器 person_list length:{{ person_list|length }}</h1>
    <h1>过滤器 date:{{ date_test|date:'Y-m-d' }}</h1>
    <h1>过滤器 slice_test:{{ slice_test|slice:'0:5' }}</h1>
    <h1>过滤器 truncatechars_test:{{ truncatechars_test|truncatechars:17 }}</h1>
    <h1>过滤器 safe_test:{{ safe_test }}</h1>
    <h1>过滤器 safe_test:{{ safe_test|safe }}</h1>

在这里插入图片描述

模板之标签

模板语言既然是一门语言，它就有自己的语法。

if标签：

{% if %}会对一个变量求值，如果它的值是“True”（存在、不为空、且不是boolean类型的false值），对应的内容块会输出。

{% if num > 100 or num < 0 %}
    <p>无效</p>
{% elif num > 80 and num < 100 %}
    <p>优秀</p>
{% else %}
    <p>凑活吧</p>
{% endif %}

with标签：

使用一个简单地名字缓存一个复杂的变量，当你需要使用一个“昂贵的”方法（比如访问数据库）很多次的时候是非常有用的。

{% with total=business.employees.count %}
    {{ total }} employee{{ total|pluralize }}
{% endwith %}

for标签：

遍历每一个元素，可以利用{% for obj in list reversed %}反向完成循环，循环序号可以通过｛｛forloop｝｝显示。

forloop.counter            The current iteration of the loop (1-indexed)
forloop.counter0           The current iteration of the loop (0-indexed)
forloop.revcounter         The number of iterations from the end of the loop (1-indexed)
forloop.revcounter0        The number of iterations from the end of the loop (0-indexed)
forloop.first              True if this is the first time through the loop
forloop.last               True if this is the last time through the loop

for 标签带有一个可选的{% empty %} 从句，以便在给出的组是空的或者没有被找到时，可以有所操作。

    <h1>for标签</h1>
    {% for item in course %}
        <h1>{{ forloop.counter }}:{{ item }}</h1>
    {% endfor %}
    {% for key, value in info.items %}
        <h1>{{ key }}:{{ value }}</h1>
    {% endfor %}

在这里插入图片描述
csrf_token标签：

这个标签用于跨站请求伪造保护。

<form action="" method="post">
        {% csrf_token %}
        <input type="text" name="name">
        <input type="submit" value="提交">
</form>

自定义标签和过滤器

1、在settings中的INSTALLED_APPS配置当前app，不然django无法找到自定义的simple_tag；

2、在app中创建templatetags模块(模块名只能是templatetags)；

3、创建任意 .py 文件，如：my_tags.py；

from django import template
from django.utils.safestring import mark_safe


# register的名字是固定的，不可改变
register = template.Library()


@register.filter
def filter_multi(value1, value2):
	return value1 * value2


@register.simple_tag
def simple_tag_multi(value1, value2):
	return value1 * value2


@register.simple_tag
def my_input(id_number, arg):
	result = '<input type="text", id="%s", calss="%s"/>' % (id_number, arg)
	return mark_safe(result)

4、在使用自定义simple_tag和filter的html文件中导入之前创建的 my_tags.py；

{% load my_tags %}

5、使用simple_tag和filter，注意：filter可以用在if等语句后，simple_tag不可以

<h1>自制标签</h1>
{% load my_tags %}
<h1>{{ num|filter_multi:2 }}</h1>
<h1>{{ num|filter_multi:"[1, 2, 3]" }}</h1>
<h1>{% simple_tag_multi 2 num %}</h1>
{% if num|filter_multi:30 > 100 %}
    <h1>{{ num|filter_multi:30 }}</h1>
{% endif %}

在这里插入图片描述

模板继承extend

Django模版引擎中最强大也是最复杂的部分就是模版继承。

模版继承可以让您创建一个基本的“骨架”模版，它包含您站点中的全部元素，并且可以定义能够被子模版覆盖的 blocks 。

比如当我们查看博客的时候，每个页面除了博客内容不一样，其它地方都是一样的，此时，我们总不能对每一篇博客都写一个页面，这明显不现实，此时，我们顶一个blog_base.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{% block blog_title %}{% endblock %}</title>
</head>
<body>
<div class="blog_info">
    {% block blog_info %}
        <ul>
            <li><a href="home.html">Home</a></li>
        </ul>
    {% endblock %}
</div>
<div class="blog_content">
    {% block blog_content %}
        <ul>
            <li class="blog_content_title"></li>
            <li class="blog_content_abstract"></li>
            <li class="blog_content_main"></li>
        </ul>
    {% endblock %}
</div>
</body>
</html>

这个模板定义了一个可以用于填充博客页面信息的简单HTML骨架，不同的博客内容只需要填充到相应的block中就可以，而不需要再重新编写一份。

在这个例子中， block 标签定义了三个可以被子模版内容填充的block。

block 告诉模版引擎：子模版可能会覆盖掉模版中的这些位置。

{# 继承自blog_base.html #}
{% extends 'blog_base.html' %}

{% block blog_title %}
Alex Blog
{% endblock %}

{% block blog_info %}
<h1><li href="www.baidu.com">百度一下</li></h1>
{% endblock %}

{% block blog_content %}
<h1><li class="blog_content_title">blog_content_title</li></h1>
<h1><li class="blog_content_abstract">blog_content_abstract</li></h1>
<h1><li class="blog_content_main">blog_content_main</li></h1>
{% endblock %}

extends 标签是这里的关键，它告诉模版引擎，这个模版“继承”了另一个模版。

当模版系统处理这个模版时，首先，它将定位父模版——在此例中，就是“base.html”。

那时，模版引擎将注意到 base.html 中的三个 block 标签，并用子模版中的内容来替换这些block。

用字模板中的内容替换了block之后，HTML文档为：


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>
Alex Blog
</title>
</head>
<body>
<div class="blog_info">
        <ul>
            <h1><li><a href="home.html">Home</a></li></h1>
            
<h1><li href="www.baidu.com">百度一下</li></h1>

        </ul>
</div>
<hr>
<hr>
<div class="blog_content">
        <ul>
            
<h1><li class="blog_content_title">blog_content_title</li></h1>
<h1><li class="blog_content_abstract">blog_content_abstract</li></h1>
<h1><li class="blog_content_main">blog_content_main</li></h1>

        </ul>
</div>
</body>
</html>

继承的一些提示：

如果你在模版中使用 {% extends %} 标签，它必须是模版中的第一个标签。其他的任何情况下，模版继承都将无法工作。
在base模版中设置越多的 {% block %} 标签越好。请记住，子模版不必定义全部父模版中的blocks，所以，你可以在大多数blocks中填充合理的默认内容，然后，只定义你需要的那一个。多一点钩子总比少一点好。
如果你发现你自己在大量的模版中复制内容，那可能意味着你应该把内容移动到父模版中的一个 {% block %} 中。
如果需要从父模板获取块的内容，则变量{{ block.super }}将完成此操作。如果要添加到父块的内容，而不是完全重写父块，则这非常有用。使用插入的数据不会自动转义，因为它已在父模板中转义（如果需要）。
为了更好的可读性，你也可以给你的{% endblock %} 标签一个名字。
不能在一个模版中定义多个相同名字的 block 标签。

查看专栏详情

Alex King 007

发布了726 篇原创文章 · 获赞 402 · 访问量 31万+

他的留言板关注