Django模板与静态文件使用指南

在Django中,statictemplates 目录的职责非常明确,理解它们的区别对于构建规范的Django项目至关重要。

一、template 目录

template目录一般用于存放HTML模板文件,Django 模板系统用于将业务逻辑(Python)与展示逻辑(HTML/CSS/JS)分离,通过模板语言动态生成页面内容。其核心特性包括变量替换、标签控制和模板继承

1.1 模板语法基础

setting.py配置

在settings.py 的 TEMPLATES 中添加下面字段,指定模板文件路径

TEMPLATES = [
	{
		# ...
		'DIRS': [os.path.join(BASE_DIR, 'template')],
	}
]

模板使用

模板文件一般放在项目的template目录下,在该目录中创建一个index.html文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Django模板</title>
</head>
<body>
    <a>Django模板</a>
</body>
</html>

在视图views.py文件中,可以直接返回template 里面的文件

from django.shortcuts import render

def index(request):
    # 参数1: 当前的请求  参数2: 模板文件
    return render(request, 'index.html')

1.2 变量与标签使用

如果要将数据传入到index.html中,在index.html中可以使用{{ data }}接收数据传入变量(运算符两侧必须要有空格),如果涉及循环或条件判断,则可以使用{% tag %}标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Django模板</title>
</head>
<body>
		<!-- 变量 -->
    <a>{{ name }}</a>
		<!-- 索引 -->
    <a>{{ books.1 }}</a>
    
    <ul>
		<!-- 标签:遍历读取 -->
        {% for book in books %}
            <li>{{ book }}</li>
        {% endfor %}
    </ul>
    
    
    <!-- 标签:条件判断 -->
	{% if age >10 %}
	    大于10岁
	{% else %}
	    不大于10岁
	{% endif %}
</body>
</html>

接着修改views.py,通过context 将数据传入html中(这里的name是下面传入字典的键,得到的就是下面传入的字典的值Python)

from django.shortcuts import render
from django.http import HttpResponse

def index(request):
    # 参数1: 当前的请求   参数2: 模板文件   参数3:context传递参
    return render(request, 'index.html', context={'name': 'Python', 'book': ['aa', 'bb'], 'age': 10})

1.3 过滤器(默认值、日期格式等)

语法:{{ 变量|过滤器:参数 }}

过滤器含义
default默认值
(如果变量不存在时则返回默认值 date|default:'默认值'
length长度
(返回字符丰包含字符的个数,或列表、元组、字典的元素个数)
safe转义
(返回内容为html当存文本处理,使用转义可转为存文本)
date日期
(用于对日期类型的值进行字符串格式化 value|data:"Y年m月j日 H时i分s秒"
日期格式化字符含义解释
Y格式4位(y两位)
m01,02,12
d01,02
j1,2
H24小时制(h12小时制)
i0-59
s0-59

举例

from django.shortcuts import render
from django.views import View
import datetime

class HomeView(View):
    def get(self,request):
        username = request.GET.get('username')
        context = {
            'datetime': datetime.datetime.now(),
        }
        return render(request, 'index.html', context=context)
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
日期:{{ datetime|date:'Y m d' }}
</body>
</html>

1.4 模板继承

当某些内容在多个页面中公用时,可以使用模板继承的方法,常用于 header 和 footer 部分

父标签

我们可以建立一个基础的文件 base.html,供下方使用,这里使用block标签在父模板中预留区域,在子模板中将其替换填充差异性的内容。预留区域也可以直接填写内容(即默认内容),当子模块未填充的时候,则使用这里的默认内容

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{% block title %}Title{% endblock title %}</title>
</head>
<body>
{% block header %}
<h1>顶部</h1>
{% endblock header %}

{% block main %}
<h1>主要部分</h1>
{% endblock main %}

{% block footer %}
<h1>底部</h1>
{% endblock footer %}
</body>
</html>

子标签

在子模块中,可以在第一行使用标签extends将父标签导入进来,然后使用 block标签 填写该区域对应的内容。子模版不用填充父模版中的所有预留区域,如果子模版没有填充,则使用父模版定义的默认值

{% extends 'base.html' %}

{% block title %}
替换标题
{% endblock title %}

{% block main %}
<a href="">替换主体</a>
{% endblock main %}

{% block footer %}{% endblock %}

1.5 jinja2模板

jinja2是 Python 下的一个被广泛应用的模板引擎,是由Python实现的模板语言,他的设计思想来源于Django的模板引擎,并扩展了其语法和一系列强大的功能,尤其是Flask框架内置的模板语言。由于django默认模板引擎功能不齐全,速度慢,所以我们也可以在Django中使用jinja2,jinja2宣称比django默认模板引擎快10-20倍。Django主流的第三方APP基本上也都同时支持Diango默认模板及inja2,所以要用inia2也不会有多少障碍。

jinja2模板安装pip install jinja2
jiaja2配置:在settings.py中配置

TEMPLATES = [
    {
        # 'BACKEND': 'django.template.backends.django.DjangoTemplates',  # 默认引擎
        'BACKEND': 'django.template.backends.jinja2.Jinja2',  # 修改为Jinja2模板
        'DIRS': [os.path.join(BASE_DIR, 'template')],
        'APP_DIRS': True,
        'OPTIONS': {
            'environment': 'jinja2.Environment',  # 添加这行  默认的,可加可不加
            'context_processors': [
                'django.template.context_processors.debug',
                'django.template.context_processors.request',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
            ],
        },
    },# 如果报错,原始的代码复制到下面
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',  # 默认引擎
        'DIRS': [os.path.join(BASE_DIR, 'template')],
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                'django.template.context_processors.debug',
                'django.template.context_processors.request',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
            ],
        },
    },
]

如果还是按之前的方式来使用,这里可能会出现错误

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
日期:{{ datetime|date:'Y m d' }}
</body>
</html>

这是因为jiaja2的语法和上面模板的语法有些区别,区别在于过滤器不同,上面的模板是forloop,jiaja2是loop

jiaja2过滤器

优化后的内容如下

<body>
日期:{{ date(datetime) }}
</body>
from django.views import View
import datetime

class HomeView(View):
    def get(self,request):
        context = {
            'datetime': datetime.datetime.now(),
        }
        return render(request, 'index.html', context=context)

接着在子应用中创建jinja2_env.py文件,内容如下(否则会显示date未定义)

from django.template.defaultfilters import date
from jinja2 import Environment

def environment(**option):
    # 1.创建Environment实例
    env = Environment(**option)
    # 2.指定jinja2的函数指向django的指定过滤器
    env.globals.update({
        'date': date
    })
    # 3.返回Environment实例
    return env

然后修改配置 settings.py,改为调用自己定义的,改完之后就可以正常访问

TEMPLATES = [
    {
        # 'BACKEND': 'django.template.backends.django.DjangoTemplates',  # 默认引擎
        'BACKEND': 'django.template.backends.jinja2.Jinja2',  # 修改为Jinja2模板
        'DIRS': [os.path.join(BASE_DIR, 'template')],
        'APP_DIRS': True,
        'OPTIONS': {
            # 'environment': 'jinja2.Environment',  # 添加这行  默认的,可加可不加
            'environment': 'book.jinja2_env.environment',  # 指定jinja2的环境
            'context_processors': [
                'django.template.context_processors.debug',
                'django.template.context_processors.request',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
            ],
        },
    },# 如果报错,原始的代码复制到下面
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',  # 默认引擎
        'DIRS': [os.path.join(BASE_DIR, 'template')],
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                'django.template.context_processors.debug',
                'django.template.context_processors.request',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
            ],
        },
    },
]

要显示特定的格式,在后面和之前一样添加参数

<body>

日期:{{ date(datetime,'Y m d') }}
</body>

自定义过滤器

from jinja2 import Environment

def environment(**option):
    # 1.创建Environment实例
    env = Environment(**option)
    # 2.将自定义过滤器添加到环境中
    env.filters['do_listreverse'] = do_listreverse
    # 3.返回Environment实例
    return env

# 自定义过滤器
def do_listreverse(li):
    if li == 'B':
        return "abcd"

二、static目录(静态文件)

static 目录一般用于存放静态资源文件,这些是HTML中引用的、不需要动态处理的资源文件。

setting.py 配置

配置 settings.py 文件,指定静态文件所存放路径

# Django通过STATIC_UR区分静态资源和动态资源
# 定义模板中引用静态文件时的URL前缀
STATIC_URL = 'static/'
# 指定项目级别的静态文件目录,BASE_DIR变量在该文件上面有定义
STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'static')
]

如果静态文件目录存在图片,运行时访问http://127.0.0.1:8000/static/1.jpeg就会出现static中的图片

模板文件中引用静态文件

加载static模板标签:在html文件顶部加载static模板标签
引用静态文件的路径:使用{% static %}模板标签生成完整路径

{% load static %}
<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="{% static 'myapp/css/style.css' %}">
</head>
<body>
    <script src="{% static 'myapp/js/script.js' %}"></script>
</body>
</html>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值