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

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

news 2025/10/31 0:41:43

 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

css实现圆环展示百分比，根据值动态展示所占比例

代码如下 <view class""><view class"circle-chart"><view v-if"!!num" class"pie-item" :style"{background: conic-gradient(var(--one-color) 0%,#E9E6F1 ${num}%),}"></view><view v-else …...

编程新知 2025/10/29 22:15:20

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

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

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

从零实现STL哈希容器：unordered_map/unordered_set封装详解

本篇文章是对C学习的STL哈希容器自主实现部分的学习分享 希望也能为你带来些帮助~ 那咱们废话不多说&#xff0c;直接开始吧&#xff01; 一、源码结构分析 1. SGISTL30实现剖析 // hash_set核心结构 template <class Value, class HashFcn, ...> class hash_set {ty…...

编程新知 2025/10/27 21:53:05

【C++从零实现Json-Rpc框架】第六弹 —— 服务端模块划分

一、项目背景回顾 前五弹完成了Json-Rpc协议解析、请求处理、客户端调用等基础模块搭建。 本弹重点聚焦于服务端的模块划分与架构设计&#xff0c;提升代码结构的可维护性与扩展性。 二、服务端模块设计目标 高内聚低耦合&#xff1a;各模块职责清晰&#xff0c;便于独立开发…...

编程新知 2025/10/13 4:15:41

【HarmonyOS 5 开发速记】如何获取用户信息（头像/昵称/手机号）

1.获取 authorizationCode&#xff1a; 2.利用 authorizationCode 获取 accessToken&#xff1a;文档中心 3.获取手机&#xff1a;文档中心 4.获取昵称头像&#xff1a;文档中心 首先创建 request 若要获取手机号&#xff0c;scope必填 phone&#xff0c;permissions 必填 …...

编程新知 2025/9/17 2:39:21

今日学习：Spring线程池|并发修改异常|链路丢失|登录续期|VIP过期策略|数值类缓存

文章目录 优雅版线程池ThreadPoolTaskExecutor和ThreadPoolTaskExecutor的装饰器并发修改异常并发修改异常简介实现机制设计原因及意义 使用线程池造成的链路丢失问题线程池导致的链路丢失问题发生原因 常见解决方法更好的解决方法设计精妙之处 登录续期登录续期常见实现方式特…...

编程新知 2025/9/17 22:26:02

elementUI点击浏览table所选行数据查看文档

项目场景&#xff1a; table按照要求特定的数据变成按钮可以点击 解决方案&#xff1a; <el-table-columnprop"mlname"label"名称"align"center"width"180"><template slot-scope"scope"><el-buttonv-if&qu…...

编程新知 2025/10/29 8:10:16

快速排序算法改进:随机快排-荷兰国旗划分详解

随机快速排序-荷兰国旗划分算法详解 一、基础知识回顾1.1 快速排序简介1.2 荷兰国旗问题 二、随机快排 - 荷兰国旗划分原理2.1 随机化枢轴选择2.2 荷兰国旗划分过程2.3 结合随机快排与荷兰国旗划分 三、代码实现3.1 Python实现3.2 Java实现3.3 C实现 四、性能分析4.1 时间复杂度…...

编程新知 2025/10/30 20:17:43

python打卡第47天

昨天代码中注意力热图的部分顺移至今天 知识点回顾&#xff1a; 热力图 作业&#xff1a;对比不同卷积层热图可视化的结果 def visualize_attention_map(model, test_loader, device, class_names, num_samples3):"""可视化模型的注意力热力图&#xff0c;展示模…...

编程新知 2025/9/29 9:08:30

SpringCloud优势

目录 完善的微服务支持 高可用性和容错性 灵活的配置管理 强大的服务网关 分布式追踪能力 丰富的社区生态 易于与其他技术栈集成 完善的微服务支持 Spring Cloud 提供了一整套工具和组件来支持微服务架构的开发，包括服务注册与发现、负载均衡、断路器、配置管理等功能…...

编程新知 2025/8/11 18:32:54