jinja2介绍

jinja2是Flask作者开发的一个模板系统,起初是仿django模板的一个模板引擎,为Flask提供模板支持,由于其灵活,快速和安全等优点被广泛使用。

jinja2的优点

jinja2之所以被广泛使用是因为它具有以下优点:

    1. 相对于Template,jinja2更加灵活,它提供了控制结构,表达式和继承等。
    2. 相对于Mako,jinja2仅有控制结构,不允许在模板中编写太多的业务逻辑。
    3. 相对于Django模板,jinja2性能更好。
    4. Jinja2模板的可读性很棒。

安装jinja2

 由于jinja2属于第三方模块,首先需要对其进行安装

1
pip3 install jinja2

  测试模板是否安装成功

1
2
3
4
python -"import jinja2"
 
# 没有报错就表示安装成功
# 必须用双引号"

jinja2语法

作为一个模板系统,它还提供了特殊的语法,我们按照它支持的语法进行编写之后,就能使用jinja2模块进行渲染。

一、基本语法

在jinja2中,存在三种语法:

    1. 控制结构 (逻辑代码){% %}
    2. 变量取值 {{ }}
    3. 注释 {# #}

  下面是一个简单的jinja2例子

{% for file in filenames %}
...
{% endfor %}

可以看到,for循环的使用方式和Python比较类似,但是没有了句尾的冒号,另外需要使用endfor最为结尾,其实在jinja2中,if也是一样的,结尾需要使用endif。

jinja2模板中使用 {{ }} 语法表示一个变量,它是一种特殊的占位符。当利用jinja2进行渲染的时候,它会把这些特殊的占位符进行填充/替换,jinja2支持python中所有的Python数据类型比如列表、字段、对象等。

1
2
3
<p>this is a dicectory:{{ mydict['key'] }} </p>
<p>this is a list:{{ mylist[3] }} </p>
<p>this is a object:{{ myobject.something() }} </p>

jinja2中的过滤器

变量可以通过“过滤器”进行修改,过滤器可以理解为是jinja2里面的内置函数和字符串处理函数。

  常用的过滤器有:

过滤器名称     说明    
safe  渲染时值不转义
capitialize  把值的首字母转换成大写,其他子母转换为小写
 lower  把值转换成小写形式 
 upper  把值转换成大写形式 
 title  把值中每个单词的首字母都转换成大写
 trim  把值的首尾空格去掉
 striptags  渲染之前把值中所有的HTML标签都删掉
join   拼接多个值为字符串
 replace  替换字符串的值
 round  默认对数字进行四舍五入,也可以用参数进行控制
int   把值转换成整型

  那么如何使用这些过滤器呢? 只需要在变量后面使用管道(|)分割,多个过滤器可以链式调用,前一个过滤器的输出会作为后一个过滤器的输入。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
{{ 'abc' | captialize  }}
# Abc
 
{{ 'abc' | upper  }}
# ABC
 
{{ 'hello world' | title  }}
# Hello World
 
{{ "hello world" | replace('world','daxin') | upper }}
# HELLO DAXIN
 
{{ 18.18 | round | int }}
# 18

jinja2中的控制结构

 jinja2中的if语句类似与Python的if语句,它也具有单分支,多分支等多种结构,不同的是,条件语句不需要使用冒号结尾,而结束控制语句,需要使用endif关键字

1
2
3
4
5
6
7
{% if daxin.safe %}
daxin is safe.
{% elif daxin.dead %}
daxin is dead
{% else %}
daxin is okay
{% endif %}

jinja2中的宏

宏类似于Python中的函数,我们在宏中定义行为,还可以进行传递参数,就像Python中的函数一样一样儿的。

  在宏中定义一个宏的关键字是macro,后面跟其 宏的名称和参数等

1
2
3
4
5
{% macro input(name,age=18) %}   # 参数age的默认值为18
 
 <input type='text' name="{{ name }}" value="{{ age }}" >
 
{% endmacro %}

  调用方法也和Python的类似

1
2
<p>{{ input('daxin') }} </p>
<p>{{ input('daxin',age=20) }} </p>

jinja2中的继承和super函数

jinja2中最强大的部分就是模板继承。模板继承允许我们创建一个基本(骨架)文件,其他文件从该骨架文件继承,然后针对自己需要的地方进行修改。

  jinja2的骨架文件中,利用block关键字表示其包涵的内容可以进行修改。

  以下面的骨架文件base.html为例:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<!DOCTYPE html>
<html lang="en">
<head>
    {% block head %}
    <link rel="stylesheet" href="style.css"/>
    <title>{% block title %}{% endblock %} - My Webpage</title>
    {% endblock %}
</head>
<body>
<div id="content">{% block content %}{% endblock %}</div>
<div id="footer">
    {% block  footer %}
    <script>This is javascript code </script>
    {% endblock %}
</div>
</body>
</html>

  这里定义了四处 block,即:head,title,content,footer。那怎么进行继承和变量替换呢?注意看下面的文件

1
2
3
4
5
6
7
8
9
10
11
12
{% extend "base.html" %}       # 继承base.html文件
 
{% block title %} Dachenzi {% endblock %}   # 定制title部分的内容
 
{% block head %}
    {{  super()  }}        # 用于获取原有的信息
    <style type='text/css'>
    .important { color: #FFFFFF }
    </style>
{% endblock %}   
 
# 其他不修改的原封不同的继承

  PS: super()函数 表示获取block块中定义的原来的内容

 由于jinja2属于第三方模块,首先需要对其进行安装

1
pip3 install jinja2

  测试模板是否安装成功

1
2
3
4
python -"import jinja2"
 
# 没有报错就表示安装成功
# 必须用双引号"

Flask中的模板语言jinja2的更多相关文章

  1. Flask最强攻略 - 跟DragonFire学Flask - 第四篇 Flask 中的模板语言 Jinja2 及 render_template 的深度用法

    是时候开始写个前端了,Flask中默认的模板语言是Jinja2 现在我们来一步一步的学习一下 Jinja2 捎带手把 render_template 中留下的疑问解决一下 首先我们要在后端定义几个字符 ...

  2. 第四篇 Flask 中的模板语言 Jinja2 及 render_template 的深度用法

    是时候开始写个前端了,Flask中默认的模板语言是Jinja2 现在我们来一步一步的学习一下 Jinja2 捎带手把 render_template 中留下的疑问解决一下 首先我们要在后端定义几个字符 ...

  3. 3,Flask 中的模板语言 Jinja2 及 render_template 的深度用法

    Flask中默认的模板语言是Jinja2 现在我们来一步一步的学习一下 Jinja2 捎带手把 render_template 中留下的疑问解决一下 首先我们要在后端定义几个字符串,用于传递到前端 S ...

  4. Flask 中的模板语言 Jinja2 及 render_template 的深度用法

    是时候开始写个前端了,Flask中默认的模板语言是Jinja2 现在我们来一步一步的学习一下 Jinja2 捎带手把 render_template 中留下的疑问解决一下 首先我们要在后端定义几个字符 ...

  5. 初识Flask框架,以及Flask中的模板语言jinjia2和Flask内置的Session

    一.web框架的对比 首先我们先来看下比较火的web框架 1.Django: 优点:大而全,所有组件都是组织内部开发高度定制化,教科书级别的框架 缺点:大到浪费资源,请求的时候需要的资源较高 2.Fl ...

  6. flask 中的模板语法 jinja2及render_template的深度用法

    是时候开始写个前端了,Flask中默认的模板语言是Jinja2 现在我们来一步一步的学习一下 Jinja2 捎带手把 render_template 中留下的疑问解决一下 首先我们要在后端定义几个字符 ...

  7. python 全栈开发,Day119(Flask初识,Render Redirect HttpResponse,request,模板语言 Jinja2,用户登录例子,内置Session)

    一.Flask初识 首先,要看你学没学过Django 如果学过Django 的同学,请从头看到尾,如果没有学过Django的同学,并且不想学习Django的同学,轻饶过第一部分 三大主流Web框架对比 ...

  8. Flask - 模板语言jinja2 和render_template高级用法

    目录 Flask - 模板语言jinja2 和render_template高级用法 一. 字典传递至前端 二. 列表传入前端Jinja2 模板的操作: 三. 大字典传入前端 Jinja2 模板 四. ...

  9. Flask 的 template模板 与 jinja2语法

    Flask 的 template模板 与 jinja2语法 Flask使用的是Jinja2模板,所以其语法和Django基本无差别 1.模板基本数据的渲染 变量 {{..}} 列表 {% for it ...

随机推荐

  1. 关于游览器 cookie的操作类

    var Cookie = { getCookie : function(c_name,is){ var value = this._getCookie(c_name); if(JSON &&a ...

  2. 深入剖析GPU Early Z优化

    最近在公司群里同事发了一个UE4关于Mask材质的优化,比如在场景中有大面积的草和树的时候,可以在很大程度上提高效率.这其中的原理就是利用了GPU的特性Early Z,但是它的做法跟我最开始的理解有些 ...

  3. Nginx虚拟目录设置

    location ~ .*\.html$   匹配所有以.html结尾的链接 --------------------------------------------------------- 关于a ...

  4. maven pom.xml 项目报错

    Failed to read artifact descriptor for org.springframework.boot:spring-boot-starter-web:jar:2.1.0.RE ...

  5. 使用Powershell实现计算机名称及IP地址修改

    我的第一篇博客分享,写这个代码的用途是在公司Ghost完系统之后去修改本地计算机名称及IP 地址,用Powershell实现. 1. 代码第一部分,检查Powershell是否已管理员权限执行,如果不 ...

  6. SpringCloud-day02-服务消费者项目建立

    4.4microservice-ticket-consumer-80服务消费者项目建立 我们新建一个服务器提供者module子模块,类似前面建的common公共模块,名称是 microservice- ...

  7. Linux shell 信号继承

    shell中,向进程发送信号多多通过ctrl键加上一些功能键来实现,这里是常见的Ctrl组合键及其意义: 组合键 信号类型 意义 Ctrl+C INT信号,即interrupt信号 停止运行当前的作业 ...

  8. 相机标定——OpenCV-Python Tutorials

    原文地址http://opencv-python-tutroals.readthedocs.io/en/latest/py_tutorials/py_calib3d/py_calibration/py ...

  9. Linux Ipv6地址配置

    Step1:启用IPV6网络配置 [root@node-1 ~]# vi /etc/sysconfig/network NETWORKING_IPV6=yes   //全局启用ipv6初始化IPV6_ ...

  10. jq获取图片并转换为base64

    html代码: <input type="file" id="file1"/> jq代码: $('#file1').change(function( ...