当前位置： 首页 > news >正文

Web应用框架-Django应用基础（3）-Jinja2

news 2025/12/15 11:46:19

 1.创建姓名模板

username里的数据发生改变，页面中渲染的数据发生改变，该效果称为动态数据

#hello/views:def hello_user(request):username='000'html= '''<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Title</title></head><body><h1 style='color:#f00;'>hello{{username}}</h1></body></html>'''.replace('{{username}}',username)return HttpResponse(html)# hello/urls:path('hello_user/', hello_user, name='hello_user'),

2.Django模板相关配置

2.1 安装 Jinja2：

pip3 install jinja2 -i  https://pypi.tuna.tsinghua.edu.cn/simple

2.2 渲染机制: 

步骤一:从磁盘读取模板文件(get_template)

步骤二:选择合适的模板引擎(select_template)

步骤三:将制定内容对模板进行渲染(render)

步骤四:发送给浏览器显示

3.启用Jinja2的双种模板引擎测试

3.1配置settings: 

BACKEND:模板引擎配置，配置哪一种模板，默认配置Django自带模板DTL。

DIRS:存放模板的目录地址，模板引擎按列表顺序搜索这些目录以查找模板源文件。

APP DIRS: 模板应用范围，True 表示 它会在全局工程目录中查找模板文件。

OPTIONS: 其他选项配置。

多个页面模板引擎，加载顺序由上至下，DTL中能匹配则使用DTL，否则使用jinja2：

TEMPLATES = [{'BACKEND': 'django.template.backends.django.DjangoTemplates','DIRS': [os.path.join(BASE_DIR / 'templates')],'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',],},},
]

3.2 添加模板

新建jinja2文件夹：jinja2_home.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><h1>jinja2首页</h1>
</body>
</html>

3.3新建并配置Jinja2环境：

TEMPLATES = [{'BACKEND': 'django.template.backends.jinja2.Jinja2','DIRS': [os.path.join(BASE_DIR / 'jinja2')],#模板所在位置}]

3.4 访问Jinja2模板的首页

#hello/views:def go_jinja2(request):return render(request,'jinja2_home.html')#hello/urls:path('go_jinja2/', go_jinja2, name='go_jinja2'),

3.5 网页显示

4.模板变量

4.1 模板引擎变量应用

def index_variable(request):username = '000'age = 2img_url = "/media/5.jpg"list_users = [{'username':'adela','age':20},{'username':'Duruo','age':30}]return render(request,'index.html',{'username':username,'age':age,'img_url':img_url,'list_users':list_users,})

path('index_variable/', index_variable, name='index_variable'), 

4.2  简单数据类型的渲染

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><h1>我的HTML标签</h1><p>用户名：{{ username }}</p><p>年龄：{{ age }}</p><p><img src="{{ img_url }}" alt=""></p><p>用户列表</p>{% for user in list_users %}<p>用户名：{{ user.username }}</p><p>年龄：{{ user.age }}</p><img width="300" src="{{ img_url }}" alt="">{% endfor %}
</body>
</html>

5.DTL与Jinja2的使用区别

5.1 字典（Dictionary）输出

DTL变量名称中不能有空格或标点符合

下面的语法在DTL中不被支持：

{{ object[" a.b "] }}   {{ object[" a b "] }}

5.2 类（Class）对象输出

类中的成员方法调用不需要(),也不支持参数传递。

 5.3 小结

字典是通过键值对存储数据的集合，而类实例是对象，其数据和行为封装在类定义中。

字典的值可以通过键直接访问，而类实例的值通常需要通过方法或属性来访问。

在模板中，字典的键可以直接用变量标签 {{ }} 访问，而类实例的方法需要用相同的方式调用。

#hello/Views(变量)

#模板引擎变量应用
def index_variable(request):username = '000'age = 2img_url = "/media/5.jpg"list_users = [{'username':'adela','age':20},{'username':'Duruo','age':30}]user_obj = {'username':'Hella'}rat = Rat()return render(request,'index.html',{'username':username,'age':age,'img_url':img_url,'list_users':list_users,'user_obj':user_obj,'rat':rat})class Rat(object):def display(self):return "辛迪加文明大使"

#templates/index.html (模版标签)

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><h1>我的HTML标签</h1><p>用户名：{{ username }}</p><p>年龄：{{ age }}</p><p><img src="{{ img_url }}" alt=""></p><p>用户列表</p>{% for user in list_users %}<p>用户名：{{ user.username }}</p><p>年龄：{{ user.age }}</p><img width="300" src="{{ img_url }}" alt="">{% endfor %}<p>{{ user_obj.username }}</p><p>{{ rat.display }}</p>{# 调用对象函数时，不需要写括号，不能传参数 #}
</body>
</html>

6.循环控制

6.1循环语法结构：

循环：
{% for user in list_users %}    ~巴拉巴拉巴拉~    {% endfor %}
字典循环：
{% for key,values in data.items %}    ~巴拉巴拉巴拉~    {% endfor %}
重复循环（循环嵌套）：
{% cycle "row1" "row2" %}

6.2 循环中的变量：

变量描述
forloop.first如果是第一次迭代，为True
forloop.last如果是最后一次迭代，为True
forloop.counter0计数器，从0开始
forloop.counter计数器，从1开始

 6.3 模拟引擎for循环

def tag(request):list_user = [{'name':'Zoya','age':20},{'name':'Eirene','age':31,'sex':'female'},]return render(request,'tag.html',{'list_users':list_user})

path('tag/', tag, name='tag'),

 6.4 URL解析

新建template/tag.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><style>.row1 {color: #f00;}.row2 {color: #0f0;}</style>
</head>
<body><h1>用户列表</h1>{% for user in list_users %}<p class="{% cycle 'row1' 'row2' %}">第{{ forloop.counter }}个用户信息</p>{% for key,value in user.items %}{{ key }} - {{ value }}{% endfor %}{% empty %}<p>暂无用户信息</p>{% endfor %}
</body>
</html>

6.5 网页效果

7.注释

<!--html注释，在页面源代码中可以查看注释内容--> {# 标签注释，该注释在编译时排除该部分注释内容，因此在源码中无法显示 #} {% comment "注释" %} 
<p>HTML内容{{ create_date }}</p> 
​​​​​​​{% endcomment %}

8.静态资源URL解析

8.1 新建static文件

用于储存静态资源

8.2 解析静态文件

8.2.1 setting中设置好资源目录和链接.

# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/4.2/howto/static-files/
STATIC_URL = 'static/'
STATICFILES_DIRS = [os.path.join(BASE_DIR,'static')]#存放静态资源文件

8.2.2 获取静态文件的绝对路径:

方便后续使用 {% static %} 标签来生成 静态文件（6.jpg）的完整 URL。

<body>
{#....#}
{% load static %}
<img WIDTH="500" src="{% static '6.jpg' %}" alt="dilraba">
{#....#}
</body>

9.时间状态显示

{% now 'j S F Y H:i' %}

10.自定义过滤器

10.1 自定义过滤器步骤

步骤一:在app模块目录下新建包templatetags

步骤二：实现过滤器poll_extras.py

步骤三：注册过滤器

  • 方式一：注册过滤器 register.filter(‘ warning ’,warning)
  • 方式二：注册过滤器 register.filter(name=‘ warning ’)

步骤四：在模板中使用过滤器

10.2 新建文件-编写过滤器逻辑

from django import templateregister = template.Library()
#注册过滤器
@register.filter(name='fmt_name')
def fmt_uname(value):return '{}***'.format(value[0])

10.3 使用过滤器

#hello/views：#跳转模板使用过滤器
def mine_filter(request):username = '吴亦凡'return render(request,'mine_filter.html',{'username':username})

 path('mine/filter/', mine_filter, name='mine_filter'),

 10.4 创建mine_filter

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><p>{{ username }}</p>{% load format_name %}<p>{{ username|fmt_name }}</p>
</body>
</html>

10.5 settings配置模块

添加'hello'，确保 Django 项目能够识别和使用 hello 应用中定义的过滤功能。

# Application definition installed_appsINSTALLED_APPS = ['django.contrib.admin','django.contrib.auth','django.contrib.contenttypes','django.contrib.sessions','django.contrib.messages','django.contrib.staticfiles','hello'
]

相关文章：

Web应用框架-Django应用基础（3）-Jinja2

1.创建姓名模板 username里的数据发生改变&#xff0c;页面中渲染的数据发生改变&#xff0c;该效果称为动态数据 #hello/views:def hello_user(request):username000html <!DOCTYPE html><html lang"en"><head><meta charset"UTF-8&quo…...

编程日记 2024/10/27 5:32:34

js(深浅拷贝，节流防抖，this指向，改变this指向的方法)

一、深浅拷贝 1.基本数据类型和引用数据类型的区别&#xff1a; 1. 基本数据类型的变量存储的是值 引用数据类型的变量存储的是地址值 2. 基本数据类型的变量存储的值在栈内存 引用数据类型的变量存储的值在堆内存 3. 基本数据类型的变量存储的是值和值之间相互不影响 引用数据…...

编程日记 2024/10/27 5:31:33

香橙派5(RK3588)使用npu加速yolov5推理的部署过程

香橙派5使用npu加速yolov5推理的部署过程 硬件环境 部署过程 模型训练(x86主机) 在带nvidia显卡(最好)的主机上进行yolo的配置与训练, 获取最终的best.pt模型文件, 详见另一篇文档 模型转换(x86主机) 下载airockchip提供的yolov5(从pt到onnx) 一定要下这个版本的yolov5, …...

编程日记 2024/10/27 5:28:28

基于MWORKS的蓝桥杯「智能装备数字化建模大赛」正式发布，首期培训本周六开启

为强化装备数字化人才培养&#xff0c;推动装备数字化技术快速发展&#xff0c;第十六届蓝桥杯全国软件和信息技术专业人才大赛设置专项赛暨智能装备数字化建模大赛&#xff0c;使用MWORKS作为参赛软件。关于参赛软件授权、技术支持与培训、教材与案例开发支持、成果转化培训及…...

编程日记 2024/10/27 5:26:24

021、深入解析前端请求拦截器

目录 深入解析前端请求拦截器&#xff1a; 1. 引言 2. 核心实现与基础概念 2.1 基础拦截器实现 2.2 响应拦截器配置 3. 实际应用场景 3.1 完整的用户认证系统 3.2 文件上传系统 3.3 API请求缓存系统 3.4 请求重试机制 3.5 国际化处理 4. 性能优化实践 4.1 请求合并…...

编程日记 2024/10/27 5:25:22

windows中的tracert命令

在 Windows 操作系统中&#xff0c;tracert&#xff08;全称 Trace Route&#xff09;是一个用于确定 IP 数据包到达目标主机所经过的路径的命令行工具。它通过发送具有不同生存时间&#xff08;TTL&#xff09;的 ICMP&#xff08;Internet Control Message Protocol&#xff…...

编程日记 2024/10/27 5:24:21

【玩儿】Java 数字炸弹小游戏（控制台版）+ IO 数据存储

Java 数字炸弹小游戏&#xff08;控制台版&#xff09; IO 数据存储 数字炸弹小游戏概述功能实现实体类User.java 玩家信息实体类GameRecode.java 游戏记录实体类 自定义异常AccountLockedException.java 账号锁定异常PasswordErrorException.java 密码错误异常UnknowAccountEx…...

编程日记 2024/10/27 5:22:20

今日头条躺赚流量：自动化新闻爬取和改写脚本

构建一个自动化的新闻爬取和改写系统&#xff0c;实现热点新闻的自动整理和发布&#xff0c;需要分为以下几个模块&#xff1a;新闻爬取、信息解析与抽取、内容改写、自动发布。以下是每个模块的详细实现步骤和代码示例&#xff1a; 1. 新闻爬取模块 目标&#xff1a;从新闻网…...

编程日记 2024/10/27 5:21:19

日常实习与暑期实习详解

日常实习与暑期实习详解 问了下正在实习的同学&#xff0c;发现天要塌了–才知道日常实习是没有笔试的 1. 实习的定义 1.1 日常实习 日常实习是企业长期招聘的实习岗位&#xff0c;通常没有时间限制。企业会在需要时进行招聘&#xff0c;招聘对象包括在校大学生和大一、大二的…...

编程日记 2024/10/27 5:19:16

Git的原理和使用（六）

本文主要讲解企业级开发模型 1. 引入 交付软件的流程&#xff1a;开发->测试->发布上线 上面三个过程可以详细划分为一下过程&#xff1a;规划、编码、构建、测试、发 布、部署和维护 最初&#xff0c;程序⽐较简单&#xff0c;⼯作量不⼤&#xff0c;程序员⼀个⼈可以完…...

编程日记 2024/10/27 5:18:14

Elasticsearch 中的高效按位匹配

作者&#xff1a;来自 Elastic Alexander Marquardt 探索在 Elasticsearch 中编码和匹配二进制数据的六种方法&#xff0c;包括术语编码&#xff08;我喜欢的方法&#xff09;、布尔编码、稀疏位位置编码、具有精确匹配的整数编码、具有脚本按位匹配的整数编码以及使用 ESQL 进…...

编程日记 2024/10/27 5:16:12

LSTM，全称长短期记忆网络（Long Short-Term Memory），是一种特殊的循环神经网络（RNN）结构

关于lstm超参数设置&#xff0c;每个参数都有合适的范围&#xff0c;超过这个范围则lstm训练不再有效&#xff0c;loss不变&#xff0c;acc也不变 LSTM&#xff0c;全称长短期记忆网络&#xff08;Long Short-Term Memory&#xff09;&#xff0c;是一种特殊的循环神经网络&am…...

编程日记 2024/10/27 5:14:10

导出问题处理

问题描述 测试出来一个问题&#xff0c;使用地市的角色&#xff0c;导出数据然后超过了20w的数据&#xff0c;提示报错&#xff0c;我还以为是偶然的问题&#xff0c;然后是发现是普遍的问题&#xff0c;本地环境复现了&#xff0c;然后是&#xff0c;这个功能是三套角色&…...

编程日记 2024/10/27 5:13:09

通过cv库智能切片 把不同的分镜切出来 自媒体抖音快手混剪

用 手机自动化脚本&#xff0c;从自媒体上获取视频&#xff0c;一个商品对应几百个视频&#xff0c;我们把这几百个视频下载下来&#xff0c;进行分镜 视频切片&#xff0c;从自媒体上下载视频&#xff0c;通过cv库用直方图识别每个镜头进行切片。 下载多个图片进行视频的伪原…...

编程日记 2024/10/27 5:12:08

【机器学习】——numpy教程

文章目录 1.numpy简介2.初始化numpy3.ndarry的使用3.1numpy的属性3.2numpy的形状3.3ndarray的类型 4numpy生成数组的方法4.1生成0和1数组4.2从现有的数组生成4.3生成固定范围的数组4.4生成随机数组 5.数组的索引、切片6.数组的形状修改7.数组的类型修改8.数组的去重9.ndarray的…...

编程日记 2024/10/27 5:11:07

多线程——线程的状态

线程状态的意义 ‌线程状态的意义在于描述线程在执行过程中的不同阶段和条件&#xff0c;帮助开发者更好地管理和调度线程资源。 线程的多种状态 线程的状态是一个枚举类型&#xff08;Thread.State&#xff09;&#xff0c;可以通过线程名.getState&#xff08;&#xff09…...

编程日记 2024/10/27 5:10:06

开源数据库 - mysql - 组织结构（与oracle的区别）

组织形式区别 mysql&#xff08;Schema -> Table -> Column -> Row&#xff09; Schema&#xff08;方案&#xff09;&#xff1a; Scheme是关于数据库和表的布局及特性的信息。它可以用来描述数据库中特定的表以及整个数据库和其中表的信息&#xff0c;如表的一些特…...

编程日记 2024/10/27 5:09:05

vue3+vite 部署npm 包

公司需要所以研究了一下怎么部署安装&#xff0c;比较简单 先下载个vue项目 不用安准路由&#xff0c;pinna 啥的&#xff0c;只需要一个最简单的模版 删掉App.vue 中的其它组件 npm create vuelatest 开始写自定义组件 新建一个el-text 组件, name是重点&#xff0c;vue3中…...

编程日记 2024/10/27 5:08:04

华为鸿蒙HarmonyOS应用开发者高级认证视频及题库答案

华为鸿蒙开发者高级认证的学习资料 1、课程内容涵盖HarmonyOS系统介绍、DevEco Studio工具使用、UI设计与开发、Ability设计与开发、分布式特性、原子化服务卡片以及应用发布等。每个实验都与课程相匹配&#xff0c;帮助加深理解并掌握技能 2、学习视频资料 华为HarmonyOS开发…...

编程日记 2024/10/27 5:05:01

【计网】从零开始认识IP协议 --- 认识网络层，认识IP报头结构

从零开始认识IP协议 1 网络层协议1.1 初步认识IP协议1.2 初步理解IP地址 2 IP协议报头3 初步理解网段划分 1 网络层协议 1.1 初步认识IP协议 我们已经熟悉了传输层中的UDP和TCP协议&#xff0c;接下来我们来接触网络层的协议&#xff1a; 网络层在计算机网络中的意义主要体现…...

编程日记 2024/10/27 5:03:58

反向工程与模型迁移：打造未来商品详情API的可持续创新体系

在电商行业蓬勃发展的当下&#xff0c;商品详情API作为连接电商平台与开发者、商家及用户的关键纽带&#xff0c;其重要性日益凸显。传统商品详情API主要聚焦于商品基本信息&#xff08;如名称、价格、库存等&#xff09;的获取与展示&#xff0c;已难以满足市场对个性化、智能…...

编程新知 2025/9/15 5:56:53

MongoDB学习和应用(高效的非关系型数据库)

一丶 MongoDB简介 对于社交类软件的功能&#xff0c;我们需要对它的功能特点进行分析&#xff1a; 数据量会随着用户数增大而增大读多写少价值较低非好友看不到其动态信息地理位置的查询… 针对以上特点进行分析各大存储工具&#xff1a; mysql&#xff1a;关系型数据库&am…...

编程新知 2025/12/12 3:11:50

在 Spring Boot 中使用 JSP

jsp&#xff1f; 好多年没用了。重新整一下 还费了点时间&#xff0c;记录一下。 项目结构&#xff1a; pom: <?xml version"1.0" encoding"UTF-8"?> <project xmlns"http://maven.apache.org/POM/4.0.0" xmlns:xsi"http://ww…...

编程新知 2025/12/7 14:31:27

Kafka主题运维全指南：从基础配置到故障处理

#作者&#xff1a;张桐瑞 文章目录 主题日常管理1. 修改主题分区。2. 修改主题级别参数。3. 变更副本数。4. 修改主题限速。5.主题分区迁移。6. 常见主题错误处理常见错误1&#xff1a;主题删除失败。常见错误2&#xff1a;__consumer_offsets占用太多的磁盘。 主题日常管理 …...

编程新知 2025/6/10 21:14:43

【堆垛策略】设计方法

堆垛策略的设计是积木堆叠系统的核心&#xff0c;直接影响堆叠的稳定性、效率和容错能力。以下是分层次的堆垛策略设计方法&#xff0c;涵盖基础规则、优化算法和容错机制&#xff1a; 1. 基础堆垛规则 (1) 物理稳定性优先 重心原则&#xff1a; 大尺寸/重量积木在下&#xf…...

编程新知 2025/12/9 7:12:03

恶补电源：1.电桥

一、元器件的选择 搜索并选择电桥&#xff0c;再multisim中选择FWB&#xff0c;就有各种型号的电桥: 电桥是用来干嘛的呢&#xff1f; 它是一个由四个二极管搭成的“桥梁”形状的电路&#xff0c;用来把交流电&#xff08;AC&#xff09;变成直流电&#xff08;DC&#xff09;。…...

编程新知 2025/12/5 2:21:03

基于开源AI智能名片链动2 + 1模式S2B2C商城小程序的沉浸式体验营销研究

摘要&#xff1a;在消费市场竞争日益激烈的当下&#xff0c;传统体验营销方式存在诸多局限。本文聚焦开源AI智能名片链动2 1模式S2B2C商城小程序&#xff0c;探讨其在沉浸式体验营销中的应用。通过对比传统品鉴、工厂参观等初级体验方式&#xff0c;分析沉浸式体验的优势与价值…...

编程新知 2025/12/13 9:44:59

Appium下载安装配置保姆教程（图文详解）

目录 一、Appium软件介绍 1.特点 2.工作原理 3.应用场景 二、环境准备 安装 Node.js 安装 Appium 安装 JDK 安装 Android SDK 安装Python及依赖包 三、安装教程 1.Node.js安装 1.1.下载Node 1.2.安装程序 1.3.配置npm仓储和缓存 1.4. 配置环境 1.5.测试Node.j…...

编程新知 2025/12/15 1:09:11

02-性能方案设计

需求分析与测试设计 根据具体的性能测试需求&#xff0c;确定测试类型&#xff0c;以及压测的模块(web/mysql/redis/系统整体)前期要与相关人员充分沟通&#xff0c;初步确定压测方案及具体的性能指标QA完成性能测试设计后&#xff0c;需产出测试方案文档发送邮件到项目组&…...

编程新知 2025/11/16 8:42:10

项目研究：使用 LangGraph 构建智能客服代理

概述 本教程展示了如何使用 LangGraph 构建一个智能客服代理。LangGraph 是一个强大的工具&#xff0c;可用于构建复杂的语言模型工作流。该代理可以自动分类用户问题、分析情绪&#xff0c;并根据需要生成回应或升级处理。 背景动机 在当今节奏飞快的商业环境中&#xff0c…...

编程新知 2025/10/8 9:01:56