跳转到内容

Django模板语法

来自代码酷

Django模板语法[编辑 | 编辑源代码]

Django模板系统是Django框架中用于生成动态HTML的核心组件之一。它允许开发者将Python代码与HTML分离,同时提供了一套简洁而强大的语法来处理数据展示、逻辑控制和模板继承等任务。本章将详细介绍Django模板语法的各个方面,从基础到高级用法。

简介[编辑 | 编辑源代码]

Django模板语法主要包含以下三类标记:

  • 变量:用于显示上下文中的数据
  • 标签:提供逻辑控制结构
  • 过滤器:修改变量的显示方式

模板系统设计遵循"业务逻辑与表现分离"的原则,使得前端开发者和后端开发者可以更好地协作。

变量[编辑 | 编辑源代码]

变量是模板中最基本的元素,用于输出上下文中的值。变量使用双花括号{{ }}表示。

基本语法[编辑 | 编辑源代码]

<p>欢迎, {{ user.username }}!</p>
<p>当前时间: {{ current_time }}</p>

变量查找规则[编辑 | 编辑源代码]

Django模板系统按照以下顺序查找变量: 1. 字典查找(如user["username"]) 2. 属性查找(如user.username) 3. 方法调用(无参数方法) 4. 列表索引查找(如list.0

标签[编辑 | 编辑源代码]

标签提供了模板中的逻辑控制结构,使用{% %}语法。

常用标签[编辑 | 编辑源代码]

if标签[编辑 | 编辑源代码]

{% if user.is_authenticated %}
    <p>欢迎回来, {{ user.username }}!</p>
{% else %}
    <p>请<a href="/login">登录</a>。</p>
{% endif %}

for标签[编辑 | 编辑源代码]

<ul>
{% for item in item_list %}
    <li>{{ forloop.counter }}. {{ item.name }}</li>
{% empty %}
    <li>没有可显示的项目</li>
{% endfor %}
</ul>

block和extends标签[编辑 | 编辑源代码]

用于模板继承:

base.html

<!DOCTYPE html>
<html>
<head>
    <title>{% block title %}默认标题{% endblock %}</title>
</head>
<body>
    {% block content %}{% endblock %}
</body>
</html>

child.html

{% extends "base.html" %}

{% block title %}子页面标题{% endblock %}

{% block content %}
    <h1>这是子页面的内容</h1>
{% endblock %}

过滤器[编辑 | 编辑源代码]

过滤器用于修改变量的显示,使用管道符号|

常见过滤器[编辑 | 编辑源代码]

{{ name|lower }}  {# 转换为小写 #}
{{ bio|truncatewords:30 }}  {# 截断为30个单词 #}
{{ value|date:"Y-m-d" }}  {# 日期格式化 #}
{{ list|join:", " }}  {# 列表连接 #}

自定义过滤器[编辑 | 编辑源代码]

1. 在app目录下创建templatetags目录 2. 创建__init__.py文件 3. 创建自定义过滤器文件(如custom_filters.py

示例:

from django import template

register = template.Library()

@register.filter(name='cut')
def cut(value, arg):
    return value.replace(arg, '')

使用:

{% load custom_filters %}
{{ "Hello World"|cut:" " }}  {# 输出: HelloWorld #}

模板继承[编辑 | 编辑源代码]

Django模板系统最强大的功能之一是模板继承,它允许你构建一个基础"骨架"模板,然后子模板可以覆盖其中的部分内容。

继承层次结构[编辑 | 编辑源代码]

graph TD A[base.html] --> B[child.html] A --> C[another_child.html] B --> D[grandchild.html]

多级继承示例[编辑 | 编辑源代码]

grandbase.html

<!DOCTYPE html>
<html>
<head>
    <title>{% block title %}Grand Base Title{% endblock %}</title>
</head>
<body>
    {% block main %}{% endblock %}
</body>
</html>

base.html

{% extends "grandbase.html" %}

{% block main %}
    <header>{% block header %}默认头部{% endblock %}</header>
    <div class="content">
        {% block content %}{% endblock %}
    </div>
    <footer>{% block footer %}默认页脚{% endblock %}</footer>
{% endblock %}

page.html

{% extends "base.html" %}

{% block title %}页面标题{% endblock %}

{% block header %}
    <h1>自定义头部</h1>
{% endblock %}

{% block content %}
    <p>这是页面的主要内容。</p>
{% endblock %}

国际化支持[编辑 | 编辑源代码]

Django模板支持国际化标签,便于创建多语言网站。

{% load i18n %}

<h1>{% trans "Welcome" %}</h1>
<p>{% blocktrans with name=user.username %}Hello {{ name }}!{% endblocktrans %}</p>

<p>{% trans "There is" %} {% pluralize item_count "one item" "many items" %}</p>

安全考虑[编辑 | 编辑源代码]

Django模板系统默认自动转义HTML特殊字符,防止XSS攻击。如果需要显示原始HTML,可以使用safe过滤器或autoescape标签。

{{ user_input }}  {# 自动转义 #}
{{ html_content|safe }}  {# 不转义 #}

{% autoescape off %}
    {{ html_content }}
{% endautoescape %}

性能优化[编辑 | 编辑源代码]

  • 使用{% include %}标签拆分大型模板
  • 合理使用{% cache %}标签缓存模板片段
  • 避免在模板中进行复杂计算
  • 使用select_relatedprefetch_related优化数据库查询

实际应用案例[编辑 | 编辑源代码]

电子商务产品页面[编辑 | 编辑源代码]

{% extends "shop/base.html" %}

{% block title %}{{ product.name }}{% endblock %}

{% block content %}
<div class="product-detail">
    <h1>{{ product.name }}</h1>
    <p class="price">${{ product.price }}</p>
    
    {% if product.in_stock %}
        <form action="{% url 'cart:add' product.id %}" method="post">
            {{ cart_product_form }}
            {% csrf_token %}
            <input type="submit" value="加入购物车">
        </form>
    {% else %}
        <p class="out-of-stock">缺货</p>
    {% endif %}
    
    <div class="description">
        {{ product.description|linebreaks }}
    </div>
    
    <h2>类似商品</h2>
    <div class="similar-products">
        {% for similar in similar_products %}
            <div class="item">
                <a href="{{ similar.get_absolute_url }}">
                    <img src="{{ similar.image.url }}" alt="{{ similar.name }}">
                    <p>{{ similar.name }}</p>
                </a>
            </div>
        {% empty %}
            <p>暂无类似商品</p>
        {% endfor %}
    </div>
</div>
{% endblock %}

总结[编辑 | 编辑源代码]

Django模板语法提供了一套强大而灵活的工具来创建动态网页,同时保持了代码的整洁和可维护性。通过本章的学习,你应该已经掌握了:

  • 变量、标签和过滤器的基本用法
  • 模板继承的组织方式
  • 国际化和安全相关的模板特性
  • 实际项目中的应用技巧

掌握这些概念后,你将能够构建结构良好、易于维护的Django应用程序界面。