zoukankan      html  css  js  c++  java
  • Python jinja2

    jinja2语法

    基本语法

       在jinja2中,存在三种语法:

    1. 控制结构 {% %}
    2. 变量取值 {{ }}
    3. 注释 {# #}

      下面是一个简单的jinja2例子

    {# This is jinja code
        {% for file in filenames %}
        ...
        {% endfor %}
    #}
    可以看到,for循环的使用方式和Python比较类似,但是没有了句尾的冒号,另外需要使用endfor最为结尾,其实在jinja2中,if也是一样的,结尾需要使用endif。

    jinja2变量

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

    <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   把值转换成整型

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

    {{ '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关键字。

    {% if daxin.safe %}
    daxin is safe.
    {% elif daxin.dead %}
    daxin is dead
    {% else %}
    daxin is okay
    {% endif %}

    jinja2的for循环

      jinja2中的for循环用于迭代Python的数据类型,包括列表,元组和字典。在jinja2中不存在while循环。

      迭代列表

    <ul>
    {% for user in users %}
    <li>{{ user.username|title }}</li>
    {% endfor %}
    </ul>

      迭代字典

    <dl>
    {% for key, value in my_dict.iteritems() %}
    <dt>{{ key }}</dt>
    <dd>{{ value}}</dd>
    {% endfor %}
    </dl>

          当然也可以加入else语句,在循环正确执行完毕后,执行

          在for循环中,jinja2还提供了一些特殊的变量,用以来获取当前的遍历状态:

    变量 描述
    loop.index 当前迭代的索引(从1开始)
    loop.index0 当前迭代的索引(从0开始)
    loop.first 是否是第一次迭代,返回bool
    loop.last 是否是最后一次迭代,返回bool
    loop.length 序列中的项目数量
    loop.revindex 到循环结束的次数(从1开始)
    loop.revindex0 到循环结束的次数(从0开始)

    jinja2的宏

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

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

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

      调用方法也和Python的类似

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

    jinja2的继承和Super函数

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

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

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

    <!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。那怎么进行继承和变量替换呢?注意看下面的文件

    {% 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块中定义的原来的内容

    模板填充示例

    一、准备模板template.html:

    <html>
        <head>
            <meta charset="UTF-8">
        </head>
        <body>
                <p style='font-size:15px; font-family:Arial;'>{{ content }}</p>
                <table border="1" cellspacing="0" cellpadding="0">
                <tr>
                    {% if array_table_head %}
                    {% for var_i in array_table_head %}
                        <th style="font-size: 15px; padding: 3px;">{{var_i}}</th>
                    {% endfor %}
                    {% endif %}
                </tr>
                {% if dict_table_data %}
                {% for table_data in dict_table_data %}
                <tr>
                    <th style="font-size: 12px; padding: 3px;">{{ table_data.Name }}</th>
                    <th style="font-size: 12px; padding: 3px;">{{ table_data.Type }}</th>
                    <th style="font-size: 12px; padding: 3px;">{{ table_data.Value }}</th>
                </tr>
                {% endfor %}
                {% endif %}
                </table>
        </body>
    </html>

    二、加载模板

    有了上述的html模板,后台利用如下代码读入。

    import jinja2
    env = jinja2.Environment(loader=jinja2.FileSystemLoader('./'))
    temp = env.get_template('template.html')

    注意一点: 其中path需要为当前python文件所在目录的完整路径,get_template内部的参数为html模板相对于该python文件所在目录的路径(相对路径)。

    三、模拟数据,对模板进行Render

    通过第一部分的html模板中我们不难发现该模板一共需要三个变量,content、 array_table_head 以及 dict_table_data。所以我们需要在后台对这三个变量进行模拟。

    1. 类型分析。需要注意的是,变量的类型一定要把控好,从模板的观察可以看出content是直接用{{ }}包裹来引用的,所以在后台应该是一种可以直接取值的类型,例如str, int等。而array_table_head是通过遍历来引用的,说明最外层在后台是一个List或tuple等可遍历对象,其次在内层是直接取值的,所以后台应该是一个简单的str或者int的列表。同理,对于dict_table_data, 则是一个字典字符串,所以三个变量的模拟应该如下:

        render_dict = {}
        dict_table_data = [{'Name': 'Basketball', 'Type': 'Sports', 'Value': 5},
                           {'Name': 'Football', 'Type': 'Sports', 'Value': 4.5},
                           {'Name': 'Pencil', 'Type': 'Learning', 'Value': 5},
                           {'Name': 'Hat', 'Type': 'Wearing', 'Value': 2}]
        render_dict.update({'Content': 'Hello reader, here is a table:',
                            'array_table_head': ['Name', 'Type', 'Value'],
                            'dict_table_data': dict_table_data})

    2. 模板渲染

    最后一步,即通过render方法将变量放入模板中,然后生成新的html写入文件,此时,模板语言将会全部被转化为html。

    temp_out = temp.render(content=render_dict['Content'], 
                           array_table_head=render_dict['array_table_head'],
                           dict_table_data=render_dict['dict_table_data'])
    with open(os.path.join('./', 'out.html'), 'w', encoding='utf-8') as f:
        f.writelines(temp_out)
        f.close()
    完整实例:
    import jinja2
    import os
    env = jinja2.Environment(loader=jinja2.FileSystemLoader('./'))
    temp = env.get_template('template.html')
    
    render_dict = {}
    dict_table_data = [{'Name': 'Basketball', 'Type': 'Sports', 'Value': 5},
                       {'Name': 'Football', 'Type': 'Sports', 'Value': 4.5},
                       {'Name': 'Pencil', 'Type': 'Learning', 'Value': 5},
                       {'Name': 'Hat', 'Type': 'Wearing', 'Value': 2}]
    render_dict.update({'Content': 'Hello reader, here is a table:',
                        'array_table_head': ['Name', 'Type', 'Value'],
                        'dict_table_data': dict_table_data})
    
    
    temp_out = temp.render(content=render_dict['Content'],
                           array_table_head=render_dict['array_table_head'],
                           dict_table_data=render_dict['dict_table_data'])
    with open(os.path.join('./', 'out.html'), 'w', encoding='utf-8') as f:
        f.writelines(temp_out)
        f.close()

    另外一种方式:

    from jinja2 import Template
    
    
    TPL = '''
    <html>
        <head>
            <meta charset="UTF-8">
            <!-- Bootstrap CSS -->
            <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.0/dist/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
        </head>
        
        <body>
                <div class="alert alert-primary" role="alert">
                    A simple primary alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
                </div>
                
                <p style='font-size:15px; font-family:Arial;'>{{ content }}</p>
                <table border="1" cellspacing="0" cellpadding="0">
                <tr>
                    {% if array_table_head %}
                    {% for var_i in array_table_head %}
                        <th style="font-size: 15px; padding: 3px;">{{var_i}}</th>
                    {% endfor %}
                    {% endif %}
                </tr>
                {% if dict_table_data %}
                {% for table_data in dict_table_data %}
                <tr>
                    <th style="font-size: 12px; padding: 3px;">{{ table_data.Name }}</th>
                    <th style="font-size: 12px; padding: 3px;">{{ table_data.Type }}</th>
                    <th style="font-size: 12px; padding: 3px;">{{ table_data.Value }}</th>
                </tr>
                {% endfor %}
                {% endif %}
                </table>
          <!-- Optional JavaScript -->
        <!-- jQuery first, then Popper.js, then Bootstrap JS -->
        <script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
        <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
        <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.0/dist/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>       
        </body>
    </html>
    '''
    
    render_dict = {}
    dict_table_data = [{'Name': 'Basketball', 'Type': 'Sports', 'Value': 5},
                       {'Name': 'Football', 'Type': 'Sports', 'Value': 4.5},
                       {'Name': 'Pencil', 'Type': 'Learning', 'Value': 5},
                       {'Name': 'Hat', 'Type': 'Wearing', 'Value': 2}]
    render_dict.update({'Content': 'Hello reader, here is a table:',
                        'array_table_head': ['Name', 'Type', 'Value'],
                        'dict_table_data': dict_table_data})
    
    content = Template(TPL).render(render_dict)
    with open('out.html', "w") as f:
            f.write(content)  # 写入文件
    引入在线bootstrap
    from jinja2 import Template
    
    
    TPL = '''
    <html>
        <head>
            <meta charset="UTF-8">
        </head>
        <body>
                <p style='font-size:15px; font-family:Arial;'>{{ content }}</p>
                <table border="1" cellspacing="0" cellpadding="0">
                <tr>
                    {% if array_table_head %}
                    {% for var_i in array_table_head %}
                        <th style="font-size: 15px; padding: 3px;">{{var_i}}</th>
                    {% endfor %}
                    {% endif %}
                </tr>
                {% if dict_table_data %}
                {% for table_data in dict_table_data %}
                <tr>
                    <th style="font-size: 12px; padding: 3px;">{{ table_data.Name }}</th>
                    <th style="font-size: 12px; padding: 3px;">{{ table_data.Type }}</th>
                    <th style="font-size: 12px; padding: 3px;">{{ table_data.Value }}</th>
                </tr>
                {% endfor %}
                {% endif %}
                </table>
        </body>
    </html>
    '''
    
    render_dict = {}
    dict_table_data = [{'Name': 'Basketball', 'Type': 'Sports', 'Value': 5},
                       {'Name': 'Football', 'Type': 'Sports', 'Value': 4.5},
                       {'Name': 'Pencil', 'Type': 'Learning', 'Value': 5},
                       {'Name': 'Hat', 'Type': 'Wearing', 'Value': 2}]
    render_dict.update({'Content': 'Hello reader, here is a table:',
                        'array_table_head': ['Name', 'Type', 'Value'],
                        'dict_table_data': dict_table_data})
    
    
    content = Template(TPL).render(render_dict)
    with open('out.html', "w") as f:
            f.write(content)  # 写入文件
  • 相关阅读:
    SQL SERVER批量/单个修改表的所有者
    设置电脑右下角显示自己的大名
    javascript 事件查询 综合
    电脑命令大全值得珍藏
    仿flash超炫焦点图播放器 · javascript for jquery
    VirtualBox使用本地硬盘分区的权限问题
    同步时间并更新到计算机
    linux下电子词典里的扩展存储卡不能访问到的问题
    virtualbox 3.0.4终于可以共享剪贴板了
    批量更改mp3文件ID3编码的脚本
  • 原文地址:https://www.cnblogs.com/-wenli/p/13956401.html
Copyright © 2011-2022 走看看