五、html中的模板继承

最新推荐文章于 2023-08-29 21:29:31 发布

超级大饭粒

最新推荐文章于 2023-08-29 21:29:31 发布

阅读量5.3k

点赞数

分类专栏： django

本文链接：https://blog.csdn.net/qq_25611295/article/details/85143474

版权

django 专栏收录该内容

18 篇文章

订阅专栏

extend模板继承
到目前为止，我们的模板范例都只是些零星的 HTML 片段，但在实际应用中，你将用 Django 模板系统来创建整个 HTML 页面。这就带来一个常见的 Web 开发问题：在整个网站中，如何减少共用页面区域（比如站点导航）所引起的重复和冗余代码？Django 解决此类问题的首选方法是使用一种优雅的策略—— 模板继承。
本质上来说，模板继承就是先构造一个基础框架模板，而后在其子模板中对它所包含站点公用部分和定义块进行重载。

1、首先我们定义一个基础模板：base.html

{% load staticfiles %}

<!DOCTYPE html>

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>liaochao's Django</title>
    <script src="{% static 'service-worker.js' %}"></script>
</head>
<body>
<h1>我是顶部菜单</h1>
<div>
     {% block content %}

     {% endblock %}
</div>
</body>
</html>

2、我们将login.html当做子模板，继承base.html有的属性。

{% extends "base.html" %}
{% block content %}
<!-- html只也可以直接传入list并且切片-->
    <h1> {{ a.0 }} </h1>


    {%  for items in obj_list %}
        <div>
            {% if items.username == 'liaochao' %}
                <!-- 小写变大写-->
                <span id="test">{{ items.username|upper }}</span>
                <!--得到的结果加5 -->
                <span>{{ items.password|add:5 }}</span>
            {% endif %}
        </div>
    {% endfor %}
    {{ test }}
    <!-- 字符串切割-->
    <br>{{ test|cut:' ' }}</br>
    <!-- 原生时间格式-->
    <br>{{ d }}</br>
     <!-- 简化处理过后-->
    {{ d|date:'Y-m-d' }}

    {% load my_tags %}
    <p>{{ test|filter_func:'666' }}</p>
    <!-- 可以处理多个参数-->
    <p>{% simple_func 'a' 'b' 'c'  %}</p>

{% endblock %}

此时我们查看页面，可以发现login页面一直都在，并且加了一行顶部菜单字样
在这里插入图片描述
这样每个模板只包含对自己而言独一无二的代码。无需多余的部分。如果想进行站点级的设计修改，仅需修改 base.html ，所有其它模板会立即反映出所作修改。