Python(Web时代)——jinja2模板

news2024/10/7 8:23:57

简介

Jinja2是Flask框架默认支持的模板引擎,是python的web项目中被广泛应用的一种模板引擎,jinja2的作者与Flask是同一个人。

jinja2具有以下特点:

  • 非常灵活,提供了控制结构、表达式与继承等

  • 性能好

  • 可读性强

渲染一个模板,通过render_template方法即可

语法

引入渲染函数

使用之前需要先通过import 导入

from flask import render_template

注:要将模板文件放置在项目根目录的 templates文件夹中

在Jinja2中,存在三种语法

  • 变量取值 {{ }}

  • 控制结构(逻辑代码) {% %}

  • 注释 {# #}

示例1:变量取值 {{ }}

@app.route("/tmp")
def template_test():
    name = "我是字符串"
    num =1
    mylist = [1,2,3,4]
    mydict={"name":"张三","age":33}
    mytuple = (1,2,3,4)

    return render_template("template.html",name=name,num=num,mylist=mylist,mydict=mydict,mytuple=mytuple)
 

template.html 模板文件 

<!DOCTYPE html>
<html lang="en">
<head>
</head>
<body>
    <p>字符串:{{ name }}</p>
    <p>数字:{{ num }}</p>
    <p>列表:{{ mylist }}</p>
    <p>列表中的第二个元素:{{ mylist[1] }}</p>
    <p>字典:{{ mydict }}</p>
    <p>字典的name:{{ mydict['name'] }}</p>
    <p>元组:{{ mytuple }}</p>
    <p>元组的第2个元素:{{ mytuple[1] }}</p>
</body>
</html>
 

调用结果

图片

示例2:控制结构 {% %}

<!DOCTYPE html>
<html lang="en">
<head>
</head>
<body>
    <p>字符串:{{ name }}</p>
    <p>数字:{{ num }}</p>
    <p>列表:{{ mylist }}</p>
    <p>列表中的第二个元素:{{ mylist[1] }}</p>
    <p>字典:{{ mydict }}</p>
    <p>字典的name:{{ mydict['name'] }}</p>
    <p>元组:{{ mytuple }}</p>
    <p>元组的第2个元素:{{ mytuple[1] }}</p>

    {% if name=='张三' %}
        条件满足,我是张三
    {% else %}
        条件不满足
    {% endif %}

    循环列表数据:
    {% for i in mylist %}
        {{ i }}
    {% endfor %}
</body>
</html>
 

调用结果

图片

示例3:注释 {# #}

{# 循环列表数据:#}
{% for i in mylist %}
    {{ i }}
{% endfor %}

过滤器

有些时候需要对要在模板中的变量值做一些特殊处理,比如首字母大写,去掉前后空格、字符串拼接等等,这时就可以使用过滤器。

过滤器的使用

通过  |  来使用过滤器,与Linux中的管道类似

例如,将字符串的首字母大写

<p>{{ name | capitalize }}</p>

常用的过滤器

过滤器说明
safe渲染时值不转义
capitalize首字母大写,其他字母小写
lower所有字母小写
upper所有字母大写
title值中每个单词首字母大写
trim去除首尾空格
striptags渲染时删除掉值中所有HTML标签
  join拼接字符串
  replace替换字符串中的值
  round对数据进行四舍五入

示例代码

@app.route("/tmp2")
def template_test2():
    name = "harRY"
    return render_template("template2.html",name=name)
 


template2.html

<!DOCTYPE html>
<html lang="en">
<head>
</head>
<body>
    {# 首字母大写 #}
    <p>{{ name | capitalize }}</p>
    {# 单词全小写 #}
    <p>{{ "Hello World!" | lower }}</p>
    {# 去除首尾空格 #}
    <p>{{ " Hello World!  " | trim }}</p>
    {# 四舍五入取整 #}
    <p>{{ 1.26 | round }}</p>
    {# 四舍五入保留2位小数取整 #}
    <p>{{ 1.2666 | round(2) }}</p>
</body>
</html>
 

调用

图片

自定义过滤器

当遇到现有的过滤无法满足我们的需求时,这时就需要我们自定义一个过滤器了

自定义过滤器有两种方式

方式1:@app.template_filter()

# 第一种方式,用作计算字符串长度
@app.template_filter()
def str_len(args):
    return len(args)
 

方式2: 先定义方法,后采用 app.jinja_env.filters

# 第二种方式, 去除字符串中的空格
def replace_space(args):
    return args.replace(" ", "")

app.jinja_env.filters['replace_space'] = replace_space
 

使用以上自定义的过滤器

@app.route("/tmp3")
def template_test3():
    name = "harRY"
    aaa="dfs jklf  jffff  "
    return render_template("template3.html", name=name,aaa=aaa)
 

template3.html

<!DOCTYPE html>
<html lang="en">
<head>
</head>
<body>
    <p>{{ name | str_len }}</p>
    <p>{{ aaa | replace_space }}</p>
</body>
</html>
 

输出

图片

程序猿与投资生活实录已改名为  程序猿知秋,WX 公众号同款,欢迎关注!! 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/846483.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

python_day19_递归

拓展 import osdef test_os():# 列出路径下内容print(os.listdir("D:/阿里云"))# 指定路径是否为文件夹print(os.path.isdir("D:/阿里云"))# 指定路径是否存在print(os.path.exists("D:/阿里云"))if __name__ __main__:test_os()递归查文件 每…

Web安全——Burp Suite基础上

Burp Suite基础 一、Burp Suite安装和环境配置如何命令行启动Burp Suite 二、Burp Suite代理和浏览器设置FireFox设置 三、如何使用Burp Suite代理1、Burp Proxy基本使用2、数据拦截与控制3、可选项配置Options客户端请求消息拦截服务器端返回消息拦截服务器返回消息修改正则表…

杰理-改变文字背景颜色

杰理-改变文字背景颜色 text->elm.css.background_color RGB565(100,0,0);

SIMATIC WINCC V8.0安装教程(Win11系统)

SIMATIC WINCC V8.0安装教程(Win11系统) 1. 首先,安装之前需要检查软件与操作系统的兼容性,否则在安装或者使用过程中会出现各种问题。 以WinCC V8.0为例,兼容性列表列出与之兼容的操作系统版本以及注意事项,图中打钩的部分为兼容,没有打钩的部分为不兼容。 2. 在window…

贝叶斯学习

贝叶斯 贝叶斯学习的背景贝叶斯定理举例 概览选择假设— MAPMAP举例 选择假设 — 极大似然 MLML 举例: 抛硬币问题 极大似然 & 最小二乘Nave Bayesian Classifier (朴素贝叶斯分类器)举例1&#xff1a;词义消歧 (Word Sense Disambiguation)举例 2: 垃圾邮件过滤 从垃圾邮件…

2023最新 Dreamweaver 下载安装教程(非常详细)从零基础入门到精通,看完这一篇就够了(附安装包)

软件介绍 Dreamweaver简称“DW”&#xff0c;是一款专业的网页设计软件&#xff0c;集网页制作和网站管理于一身的即时检索的网页代码编辑器&#xff0c;利用对 HTML、CSS、JavaScript 等内容的支持&#xff0c;设计人员和开发人员可以在几乎任何地方快速制作并发布网页。借助…

https证书的作用是什么?

如今很多企业都有属于自己的网站&#xff0c;因为当今是网络时代&#xff0c;企业借助网站基本的发展会更加好。 网站的安全性是很重要的&#xff0c;一旦安全无法保障&#xff0c;就容易出现敏感信息被盗用的情况&#xff0c;这对企业是非常不利的&#xff0c;这个时候就需要…

图像提示词攻略--基于 stable diffusion v2

Stable Diffusion 是一种潜在的文本到图像扩散模型&#xff0c;能够在给定任何文本输入&#xff08;称为提示&#xff09;的情况下生成逼真的图像。 在本文中&#xff0c;我将讨论和探索一些提高提示有效性的方法。从在提示中添加某些关键字和组合词、从更改单词顺序及其标点符…

Vue中监听路由参数变化的几种方式

目录 一. 路由监听方式&#xff1a; 通过 watch 进行监听 1. 监听路由从哪儿来到哪儿去 2. 监听路由变化获取新老路由信息 3. 监听路由变化触发方法 4. 监听路由的 path 变化 5. 监听路由的 path 变化, 使用handler函数 6. 监听路由的 path 变化&#xff0c;触发method…

iOS 实现图片高斯模糊效果

效果图 用到了 UIVisualEffectView 实现代码 - (UIVisualEffectView *)bgEffectView{if(!_bgEffectView){UIBlurEffect *blur [UIBlurEffect effectWithStyle:UIBlurEffectStyleLight];_bgEffectView [[UIVisualEffectView alloc] initWithEffect:blur];}return _bgEffect…

QCustomPlot 给出的测试用例图示

0 1 2 3 4 5 6 7 8 9 10 移动 11 12 13 14 15 移动 16 17 18 19 20

高翔《自动驾驶中的SLAM技术》代码详解 — 第6章 2D SLAM

目录 6.2 扫描匹配算法 6.2.1 点到点的扫描匹配 6.2 扫描匹配算法 6.2.1 点到点的扫描匹配 // src/ch6/test_2dlidar_io.cc // Created by xiang on 2022/3/15. // #include <gflags/gflags.h> #include <glog/logging.h> #include <opencv2/highgui.hpp>…

Vue3如何获取和操作DOM元素

Vue3如何获取和操作DOM元素 环境&#xff1a;vue3tsvite 目标&#xff1a; 1.修改DOM的文本值和样式 2.获取后代子DOM元素,操作修改 <template><div class"content"><h1>演示</h1><p ref"pText1">这是ref为pText1的一段文…

【网络编程】揭开套接字的神秘面纱

文章目录 1 :peach:简单理解TCP/UDP协议 :peach:2 :peach:网络字节序 :peach:3 :peach:socket编程接口 :peach:3.1 :apple:socket 常见API :apple:3.2 :apple:sockaddr结构:apple: 4 :peach:简单的UDP网络程序 :peach:4.1 :apple:基本分析:apple:4.2 :apple:udpServer.hpp(重点…

海外跨境电商网站多语言一键翻译系统开发(java开源)

要搭建一个海外跨境电商网站多语言一键翻译系统&#xff0c;可以按照以下步骤进行&#xff1a; 1. 确定需求&#xff1a;首先&#xff0c;需要明确系统的功能需求和用户需求。例如&#xff0c;确定需要支持哪些语种&#xff0c;界面翻译和数据库翻译的具体要求等。 2. 选择开…

tomcat虚拟主机配置演示

一.新建用于显示的index.jsp文件&#xff0c;写入内容 二.修改tomcat/apache-tomcat-8.5.70/conf/server.xml配置文件 匹配到Host那部分&#xff0c;按上面格式在后面添加自己的域名和文件目录信息 主要是修改name和docBase 保存退出重启tomcat&#xff0c;确保tomcat运行…

0基础学习VR全景平台篇 第80篇:Insta360 影石如何直播推流

一、下载Insta360 Pro APP 1、手机进入Insta360官网Insta360 | Action Cameras | 360 Cameras | VR Cameras&#xff0c;页面往下滑动到Insta360 Pro2相机处&#xff0c;点击相机图片进入详情页。详情页继续下滑到到手机APP处&#xff0c;根据自己的手机系统选择对应的客户端进…

uView之u-line-progress进度条数值小时显示不全

经过测试&#xff0c;可以以10为分界点&#xff0c;百分比小于10的时候&#xff0c;自定义进度条数值的位置和颜色&#xff0c;如下所示&#xff1a; <u-line-progress :percent"percent"><text v-if"percent<10" style"position: absol…

Linux的shell脚本常用命令

1、前提 使用shell脚本可以将所要执行的命令行进行汇总&#xff0c;统一执行&#xff0c;制作为脚本工具&#xff0c;简化重复性工作 1.1、常用命令 1.1.1、启动命令 假设我们拥有一个halloWord.sh的脚本&#xff0c;通过cd 命令进入相对应的目录下 ./halloWord.sh1.1.2、…

Linux 常用操作命令

Linux简介及Ubuntu安装 Linux&#xff0c;免费开源&#xff0c;多用户多任务系统。基于Linux有多个版本的衍生。RedHat、Ubuntu、Debian 安装VMware或VirtualBox虚拟机。具体安装步骤&#xff0c;找百度。 再安装Ubuntu。具体安装步骤&#xff0c;找百度。 常用指令 ls  …