随笔- 310  文章- 1  评论- 0  阅读- 86066 

模板继承

模板继承和类的继承含义是一样的,主要是为了提高代码重用,减轻开发人员的工作量

{% extends 'base.html' %}

base.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{% block title %} {% endblock %}</title>
 
    {% block css %}
 
    {% endblock %}
 
 
</head>
<body>
    {% block content %}
 
    {% endblock %}
 
    {% block js %}
 
    {% endblock %}
 
</body>
</html>

  

index.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
{% extends 'base.html' %}
 
{% block title %}
    登录首页
{% endblock %}
 
{% block css %}
    <style>
        p{
            color:red
        }
    </style>
{% endblock %}
 
{% block content %}
    <P>姓名:<input type="text"></P>
    <P>密码:<input type="text"></P>
{% endblock %}
 
{% block js %}
    <script>alert('欢迎登录')</script>
{% endblock %}

  

if 、ifequal语句

1
2
3
4
5
6
7
8
9
{% if today_is_weekend %}
    <p>Welcome to the weekend!</p>
{% else %}
    <p>Get back to work.</p>
{% endif %}
 
{% ifequal user currentuser %}
   <h1>Welcome!</h1>
{% endifequal %}

  

for循环

1
2
3
4
5
6
7
{% for athlete in athlete_list %}
    <li>{{ athlete.name }}</li>
    {{forloop.counter0}} #它是从0计数的
     {{forloop.counter}} 它是从1计数的
    {% if forloop.first %}<li class="first">{% else %}<li>{% endif %}
    {% if forloop.last %}<li class="last">{% else %}<li>{% endif %}
{% endfor %}

  

注释标签

1
2
3
4
{% comment %}
This is a
multi‐line comment.
{% endcomment %}

  

include标签

1
2
3
4
5
允许在模板中包含其它的模板的内容
{% include "nav.html" %}
 
#使用关键字参数向模板传递额外的上下文
{% include "name_snippet.html" with person="Jane" greeting="Hello" %}

  

 posted on   boye169  阅读(15)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· Manus的开源复刻OpenManus初探
· 三行代码完成国际化适配,妙~啊~
· .NET Core 中如何实现缓存的预热?
· 如何调用 DeepSeek 的自然语言处理 API 接口并集成到在线客服系统
点击右上角即可分享
微信分享提示