模板的基本语法
主要分为以下几类
变量的输出
模板的标签
模板的过滤器
模板的注释
模板的运算
自定义标签或过滤器
变量输出语法
{ { var } }
当模版引擎遇到一个变量，将计算这个变量，然后将结果输出 变量名必须由字母、数字、下划线（不能以下划线开头）和点组成
当模版引擎遇到点(".")，会按照下列顺序查询： 字典查询，例如：foo[“bar”] 属性或方法查询，例如：foo.bar
数字索引查询，例如：foo[bar] 如果变量不存在， 模版系统将插入’’ (空字符串) 在模板中调用方法时不能传递参数
举例:
view.py
def demo1(request):
'''模板的语法'''
context={}
context['name']="ZhangSan"
context['a'] = [10,20,30]
context['stu'] = {"name":"lisi","age":20}
data=[
{"name":"张三","sex":1,"age":40,'state':0},
{"name":"李四","sex":0,"age":38,'state':2},
{"name":"张无忌","sex":1,"age":20,'state':1},
{"name":"赵小","sex":0,"age":18,'state':1},
]
context['dlist']=data
context['time'] = datetime.now
context['m1']=100
context['m2']=20
return render(request,"myapp/demo1.html",context)
urls.py
#模板语法测试路由
path('demo1', views.demo1,name="demo1"),
在demo.html中:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>Django的模板语法实例</h1>
<a href="{% url 'index' %}">返回首页</a>
{# 模板的单行注释 #}
<h3>1.模板中的变量输出</h3>
<ul>
<li>{{ name }} {{age}}</li>
<li>{{stu.name}} {{stu.age}}</li>
<li>{{a.0}} {{a.1}} {{a.2}}</li>
</ul>
{% comment %}
多行注释
{% endcomment %}
</body>
</html>
语法
{ % tag % }
for标签
{ % for ... in ... % }
循环逻辑
{ % endfor % }
if标签
{ % if ... % }
逻辑1
{ % elif ... % }
逻辑2
{ % else % }
逻辑3
{ % endif % }
comment标签
{ % comment % }
多行注释
{ % endcomment % }
include：加载模板并以标签内的参数渲染
{ % include "base/index.html" % }
url：反向解析
{ % url 'name' p1 p2 % }
> 作用 在输出中创建文本
> 控制循环或逻辑
> 加载外部信息到模板中
csrf_token：这个标签用于跨站请求伪造保护
{ % csrf_token % }
在demo1.html中:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h3>2.模板中的标签使用</h3>
<table width="500" border="1">
<tr>
<th>姓名</th>
<th>性别</th>
<th>年龄</th>
<th>状态</th>
</tr>
{% for vo in dlist %}
<tr>
<td>{{vo.name}}</td>
<td>{% if vo.sex == 1 %}男{% else %}女{% endif %}</td>
<td>{{vo.age}}</td>
<td>
{% if vo.state == 0 %}
管理员
{% elif vo.state == 1 %}
VIP账户
{% else %}
<span style="color:red">禁用账户</span>
{% endif %}
</td>
</tr>
{% endfor %}
</table>
令牌：{% csrf_token %}
<h3>3.模板中的过滤器使用</h3>
<ul>
<li>原值：{{ name }}</li>
<li>大写：{{ name|upper }}</li>
<li>小写：{{ name|lower }}</li>
<li>{{time}}</li>
<li>{{time|date:'Y-m-d H:i:s w'}}</li>
<li>{{a|join:":"}}</li>
</ul>
<h3>4. 模板中的运算</h3>
<ul>
<li>两个数：{{m1}}， {{m2}}</li>
<li>求和：{{ m1|add:m2 }}</li>
<li>求差：{{ m1|add:-20 }}</li>
<li>相乘：{% widthratio m1 1 m2 %}</li>
<li>相除：{% widthratio m1 m2 1 %}</li>
</ul>
</body>
</html>
语法：
{ { 变量|过滤器 } }，例如{ { name|lower } }，表示将变量name的值变为小写输出
使用管道符号 (|)来应用过滤器
通过使用过滤器来改变变量的计算结果
关闭HTML自动转义
{ { data|safe } }
可以在if标签中使用过滤器结合运算符
if list1|length > 1
过滤器能够被“串联”，构成过滤器链
name|lower|upper
过滤器可以传递参数，参数使用引号包起来
list|join:", "
default：如果一个变量没有被提供，或者值为false或空，则使用默认值，否则使用变量的值
value|default:"什么也没有"
date：根据给定格式对一个date变量格式化
value|date:'Y-m-d'
<h3>3.模板中的过滤器使用</h3>
<ul>
<li>原值：{{ name }}</li>
<li>大写：{{ name|upper }}</li>
<li>小写：{{ name|lower }}</li>
<li>{{time}}</li>
<li>{{time|date:'Y-m-d H:i:s w'}}</li>
<li>{{a|join:":"}}</li>
</ul>
加
{ { value|add:10 } }
note:value=5,则结果返回15
减
{ { value|add:-10 } }
note:value=5,则结果返回-5，加一个负数就是减法了
乘
{ % widthratio 5 1 100 % }
note:等同于：(5 / 1) * 100 ，结果返回500，
withratio需要三个参数，它会使用参数1/参数2*参数3的方式进行运算，进行乘法运算，使「参数2」=1
除
{ % widthratio 5 100 1 % }
note:等同于：(5 / 100) * 1,则结果返回0.05,和乘法一样，使「参数3」= 1就是除法了。
<h3>4. 模板中的运算</h3>
<ul>
<li>两个数：{{m1}}， {{m2}}</li>
<li>求和：{{ m1|add:m2 }}</li>
<li>求差：{{ m1|add:-20 }}</li>
<li>相乘：{% widthratio m1 1 m2 %}</li>
<li>相除：{% widthratio m1 m2 1 %}</li>
</ul>
<h3>5. 自定义过滤器和模板标签</h3>
{% load pagetag %}
大写：{{name|myupper}} <br/>
相减：{% jian m1 m2 %}
模板中的继承
模板继承可以减少页面内容的重复定义，实现页面内容的重用
典型应用：网站的头部、尾部是一样的，这些内容可以定义在父模板中，子模板不需要重复定义
block标签：在父模板中预留区域，在子模板中填充
extends继承：继承，写在模板文件的第一行
定义父模板base.html
{ % block block_name % }
这里可以定义默认值
如果不定义默认值，则表示空字符串
{ % endblock % }
定义子模板index.html
{ % extends "base.html" % }
在子模板中使用block填充预留区域
{ % block block_name % }
实际填充内容
{ % endblock % }
1,创建根级模板
名称为“base.html”
存放整个站点共用的内容
<!DOCTYPE html>
<html>
<head>
<title>{ % block title % }{ % endblock % } 水果超市</title>
</head>
<body>
top--{{logo}}
<hr/>
{ % block left % }
{ % endblock % }
{ % block content % }
{ % endblock % }
<hr/>
bottom
</body>
</html>
2,创建分支模板
继承自base.html
名为“base_*.html”
定义特定分支共用的内容
定义base_goods.html
{ % extends 'temtest/base.html' % }
{ % block title % }商品{ % endblock % }
{ % block left % }
<h1>goods left</h1>
{ % endblock % }
定义base_user.html
{ % extends 'temtest/base.html' % }
{ % block title % }用户中心{ % endblock % }
{ % block left % }
<font color='blue'>user left</font>
{ % endblock % }
定义index.html，继承自base.html，不需要写left块
{ % extends 'temtest/base.html' % }
{ % block content % }
首页内容
{ % endblock content % }
3,为具体页面创建模板,继承自分支模板
定义商品列表页goodslist.html
{ % extends 'temtest/base_goods.html' % }
{ % block content % }
商品正文列表
{ % endblock content % }
定义用户密码页userpwd.html
{ % extends 'temtest/base_user.html' % }
{ % block content % }
用户密码修改
{ % endblock content % }
4,视图调用具体页面
首页视图index
logo='welcome to itcast'
def index(request):
return render(request, 'temtest/index.html', {'logo': logo})
商品列表视图goodslist
def goodslist(request):
return render(request, 'temtest/goodslist.html', {'logo': logo})
用户密码视图userpwd
def userpwd(request):
return render(request, 'temtest/userpwd.html', {'logo': logo})
5,配置url
from django.urls import path
from . import views
urlpatterns = [
path('', views.index, name='index'),
path('list/', views.goodslist, name='list'),
path('pwd/', views.userpwd, name='pwd'),
]
base中写：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{% block title1 %}父模板标题{% endblock %}</title>
</head>
<body>
<h2>{% block title2 %}父模板标题{% endblock %}</h2>
<p>
{% block mycontent %}
此处预留内容区域
{% endblock %}
</p>
</body>
</html>
父模板中写一句：
{% extends "myapp/base.html" %}
运行就可以出现一下的：
1304
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
