一、模板简介
概述： 模板就是按照一定的规则书写的负责展示的html页面，模板引擎提供特定规则、替换的工具。
模板引擎：jinja2
目录结构
project/
templates/ #推荐使用该文件名，使用其他的名称需重新配置
manage.py模板渲染使用的方法
(1)render_template(template_name,**context)
响应一个html模板(2)render_template_string
响应一段html代码 （适合响应简短的样式的响应）
二、模板中语法的分类
1. 变量 {{ 变量名称 }}
- 视图传递给模板的数据
- 遵循变量/标识符的命名规则
- 关键字参数
实例
可以给render_template 添加关键字参数,进行变量的传递
@tem.route('/test/')
def test():
h1con = '模板的变量'
return render_template('test.html',h1=h1con) #渲染模板响应给用户
模板中使用
<h1>{{ h1 }}</h1>注意： 如果给定的变量不存在则什么都不插入（什么都没有）
2. 标签 {% 标签名称 %}
- 就是python中的逻辑的判断
- 循环/if...
三、过滤器（相当于python中的函数）
过滤器使用管道符 | 添加上函数和值进行使用
- abs 返回一个数值的绝对值
default 默认值
注意： 默认只有当前变量不存在才执行默认值，将参数boolean改为True，则bool和undefined都执行默认值
实例{{ bool|default('默认值') }} {{ bool|default('默认值',boolean=True) }} boolean默认为False- first 返回序列中的第一个元素
- last 返回序列中的最后一个值
format 格式化输出
{{ "我叫%s 我今年%d岁了 我的存款为%.2f元"|format('张三',18,123) }}- length 值长度
join 拼接
{{ ['a','b','c']|join('') }} {{ data.str|join('x') }}- safe 对视图传递的html代码进行转义解析 （默认不解析 转义掉）
- int 转换整形
- float 浮点
- string 字符串
- list 转换成列表
- upper 转换成大写
- lower 转换成小写
replace 替换
{{ 'abcd'|replace('a','x') }}- striptags 取出html标签
- trim 去除两侧空格
四、标签
语法格式：{% %}
注意： 标签有开始，就要有结束
><>=<===!=innot inandor
(1) if elif else
{% if 90<=data.grade<=100 %}
优秀
{#{% elif 80<=data.grade<=89 %}#}
{% elif 80<=data.grade %}
良
{#{% elif 70<=data.grade<=79 %}#}
{% elif 70<=data.grade %}
中
{% else %}
还可以
{% endif %}(2) for 循环
{% for ... %}
...
{% endfor %}
迭代字典
{% for k,v in data.items() %}
<p>{{ k }}----{{ v }}</p>
{% endfor %}
{% for i in range(10) %}
<p>{{ i }}</p>
{% endfor %}搭配else
{ % for i in abc % }
<p>{{ i }}</p>
{ % else % }
<h1>执行else了</h1>
{ % endfor % }注意： 当迭代的变量不存在则执行else
获取当前迭代的状态
| 变量 | 说明 |
|---|---|
| loop.index | 当前迭代的索引 从1开始 |
| loop.index0 | 当前迭代的索引 从0开始 |
| loop.first | 是否为第一次迭代 |
| loop.last | 是否为最后一次迭代 |
| loop.length | 迭代的长度 |
注意： 没有break 和 continue
五、注释
多行注释
{# 注释的内容 #}
注意： 多行注释不能嵌套多行注释
六、文件的包含 include
概述：
include语句可以把一个模板导入到另外的一个模板的指定位置，就相当于把另外的模板中的代码粘贴到了你的指定位置
结构：
{% include 路径/模板名称.html %}
实例
文件目录
project/
templates/
commom/
header.html
footer.html
index.html
manage.pymanage.py
@app.route('/')
def index():
return render_template('index.html') #跳到首页模板common/header.html
<header>导航</header>common/footer.html
<footer>底部栏</footer>index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
header,footer{
width:100%;
height:40px;
border:1px solid #000;
background-color: #000;
color: #fff;
}
div{
width:100%;
height:400px;
background-color: red;
}
</style>
</head>
<body>
{% include 'common/header.html' %}
<div></div>
{% include 'common/footer.html' %}
</body>
</html>
评论 (0)