IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> Python知识库 -> Python Flask学习 - Jinja2 模板的基本认识和使用 -> 正文阅读

[Python知识库]Python Flask学习 - Jinja2 模板的基本认识和使用

Jinja2简介

Jinja 是一种快速的、富有表现力的、可扩展的模板引擎。模板中的特殊占位符允许编写类似于 Python 语法的代码,然后向模板传递数据来呈现出最终的文档。

特征

  • 模板可以被继承或者被包含。

  • 可以在模板中定义和导入(Macro,批量处理。根据一系列预定义的规则替换一定的文本模式)。

      <!--宏定义-->
    {% macro input(name, type='text', value='') -%}
      	<input type="{{ type }}" name="{{ name }}" value="{{ value|e }}">
      {% endmacro %}
    
    • 宏定义要加 macro,结束时要用endmacro。宏名称为input,有三个参数typenamevalue
      <!--调用宏-->
      <p>用户名:{{ input('username') }}</p>
      <p>密码:{{ input('password', type='password') }}</p>
    
  • HTML 模板可以使用自动转义来防止 XSS 来自不信任的用户输入。

    • XSS 攻击 - 跨站脚本攻击,攻击者恶意制造的网页程序。通常指利用网页开发时留下的漏洞,通过巧妙的方法注入恶意指令代码到网页,使用户加载并执行。
  • 沙箱可以安全地呈现不受信任的模板。

  • AsyncIO(异步IO) 支持生成模板和调用异步函数。

  • I18N 支持 Babel。

  • 模板即时编译为优化的 Python 代码并缓存,或者可以提前编译。

  • 异常指向模板中的正确行以使调试更容易。

  • 可扩展的过滤器、测试、函数、甚至语法。

Jinja的理念

如果可能的话,应用程序的逻辑属于 Python,但它不应该因为过多地限制功能而使得模板设计者的工作变得困难。

Jinja2使用

继承

模板文件 model.html

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body style="background-color: antiquewhite">
    <h1>你好世界!</h1>
</body>
</html>

普通文件 index.html

{% extends 'model.html' %}

Python代码

@app.route('/index')
def index():
    return render_template('index.html')

页面展示:

请添加图片描述

循环控制

Python代码

@app.route('/index')
def index():
    users = [
        {'name': '孙悟空'},
        {'name': '赵云'},
        {'name': '林黛玉'},
        {'name': '武松'}
    ]
    return render_template('index.html', users=users)

model.html

<body style="background-color: antiquewhite">
{% block content %}{% endblock %}
</body>

index.html

{% extends 'model.html' %}

{% block content %}
<div>
    <ul>
        {% for user in users %}
        <li>{{ user.name }}</li>
        {% endfor %}
    </ul>
</div>
{% endblock %}

页面展示:

请添加图片描述

条件控制

Python代码

@app.route('/index')
def index():
    num = 3
    return render_template('index.html', num=num)

model.html 同循环。

index.html

{% extends 'model.html' %}

{% block content %}
<div>
    <p>
        {% if num > 10 %}
        Hello World<br>
        {% elif num < 10 %}
        Hello Python<br>
        {% else %}
        GoodBye<br>
        {% endif %}
    </p>
</div>
{% endblock %}

页面展示

请添加图片描述

过滤器

过滤器,可以对变量进行修改。

过滤器通过管道符号 | 与变量分隔开,并且在括号中可以包含可选参数。

一个变量可以链接多个过滤器,下一个过滤器过滤的内容是基于上一个过滤器的输出。

常用过滤器

  1. upper 大写字母

    所有的英文字母都将会被转化为大写字母。

    {{ 'hello'|upper }}
    

    请添加图片描述

  2. lower 小写字母

    所有的英文字母都将会被转化为小写字母。

    {{ 'HELLO'|lower }}
    

    请添加图片描述

  3. reverse 反转

    所有字符反向输出。

    {{ '你好!Python'|reverse }}
    

    请添加图片描述

  4. title 首字母大写。

    每个独立的单词的首字母将会转化为大写。

    {{ 'hello world'|title }}
    

    请添加图片描述

    备注: 如果是 helloworld 那么最终转化是 Helloworld

  5. capitalize 首字母大写,其余的小写

    将第一个单词的首字母转化为大写,其余部分的字母全部转化为小写。

    {{ 'gOOD jOB! bOy'|capitalize }}
    

    请添加图片描述

其他常用过滤器

  • safe - 禁止转义,渲染时不会转义特殊字符。
  • trim - 去掉首尾空格。
  • striptags - 去掉所有的HTML标签。
  • join - 将多个值拼接成字符串。
  • replace - 替换字符串的值。
  • round - 对数字进行四舍五入。
  • int - 转换为 int 类型。

列表过滤器

  1. 获取列表的第一个元素

    {{ list|first }}
    
  2. 获取列表的最后一个元素

    {{ list|last }}
    
  3. 将列表以从小到大重新排序

    {{ list|sort }}
    
  4. 求列表中所有值的总和

    {{ list|sum }}
    
  5. 获取列表的长度

    {{ list|length }}
    

Python代码

@app.route('/index')
def index():
    list = [1, 3, 5, 2, 4, 6, 8, 7]
    return render_template('index.html', list=list)

index.html

<div>
    首位元素:{{ list|first }}<br>
    末位元素:{{ list|last }}<br>
    排序:{{ list|sort }}<br>
    求和:{{ list|sum }}<br>
    长度:{{ list|length }}<br>
</div>

页面展示

请添加图片描述

其他列表过滤器

  • max - 获取列表中最大值
  • min - 获取列表中最小值

自定义过滤器

定义一个反转列表的过滤器。

  1. 使用装饰器添加。

    @app.template_filter('listreverse')
    def list_reverse(li: list):
        li.reverse()
        return li
    
  2. 使用app实例添加。

    def list_reverse(li: list):
        li.reverse()
        return li
    app.add_template_filter(list_reverse, "listreverse")
    

展示效果

{{ list|listreverse }}

请添加图片描述

学习过程中遇到的报错

宏定义和使用的报错

jinja2.exceptions.TemplateSyntaxError: expected token ',', got 'username'

翻译:预期令牌’,‘,得到’username’。

原因:在引入宏定义的时候,没有添加上 name 参数名。

{% macro input(name, type='text', value='') -%}
    <input type="{{ type }}" name="{{ name }}" value="{{ value|e }}">
{% endmacro %}
<div>
    <p>用户名:{{ input('username') }}</p>
    <p>密码:{{ input('password', type='password') }}</p>
</div>

解决方法:加上 name 参数名即解决。

<div>
    <p>用户名:{{ input(name='username') }}</p>
    <p>密码:{{ input(name='password', type='password') }}</p>
</div>
  Python知识库 最新文章
Python中String模块
【Python】 14-CVS文件操作
python的panda库读写文件
使用Nordic的nrf52840实现蓝牙DFU过程
【Python学习记录】numpy数组用法整理
Python学习笔记
python字符串和列表
python如何从txt文件中解析出有效的数据
Python编程从入门到实践自学/3.1-3.2
python变量
上一篇文章      下一篇文章      查看所有文章
加:2022-09-15 01:58:19  更:2022-09-15 01:58:50 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 -2024/11/15 10:25:40-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码