后端朝前端页面传递数据的方式:
return HttpResponse(''字符串类型) 具体参照上一篇博客的视图层
此处主要介绍通过 render方式传值:
第一种:
return render(request,'text.html',{'n':n}
#此处的'n'是一个key,n才是要传过去的变量名对应的值,必须通过字典形式传
第二种:
return render(request,'tetx.html',local())
#将当前所在的名称空间的名字全部传递给前端页面
后端传函数名到前端(包含对象.方法 本质还是传函数名),会自动加括号调用,可以在前端html页面打印返回值,但是不支持传参
后端传对象到前端,就相当于打印了这个对象,不定义__str__的话,打印函数地址
前端获取后端传过来的容器类型的内部元素 统一采用句点符(.) 需要注意,集合无法索引取值
t={'name':['a','b']} >>> {{t.name.1}} #b 数字对应的就是列表的索引
前端的模板语法可以调用python后端数据类型不需要传参的内置方法。
django的模板注释 》》》 {# 是不会出现在前端页面的 #}
原生的html注释 》》》 <!-- 原生的html注释会出现在前端html页面-->
过滤器:
<p>前端统计字符串的长度:{{ s|length }}</p>
<p>前端获取数据如果是空就返回default后面默认的参数值:{{ flag|default:'你这个东西是个空'}}</p>
<p>将数字格式化成表示文件大小的单位:{{ file_size|filesizeformat }}</p>
<p>{{ ctime }}</p>
<p>格式化时间(不要加百分号){{ ctime|date:'Y-m-d' }}</p>
<p>字符串的切片操作:{{ res|slice:'0:8' }}</p>
<p>{{ res|slice:'0:8:2' }}</p>
<p>截取固定的长度的字符串 三个点也算:{{ s|truncatechars:10 }}</p>
<p>按照空格截取文本内容:{{ res|truncatewords:4 }}</p>
<p>{{ s|truncatewords:4 }}</p>
<p>{{ 'hahah'|add:'heheheh' }}</p>
{#重点#}
<p>{{ ht }}</p> ht ='<p>段落</p>'
<p>{{ sr }}</p>
<p>{{ ht|safe }}</p> sr = sr = '<script>alert(123)</script>'
<p>{{ sr|safe }}</p>
通过添加safe,将字符串类型的样式在html页面展示出来
当后端传入css样式的字符串时,前端可通过{{xxx|safe}} 来实现样式的正常渲染
也可以直接传入该字符串对应的变量名,前提是后端已经做好了处理:如下
from django.utils.safestring import mark_safe
xxx = mark_safe('<h1>我是h1标签</h1>')
前端可以直接使用{{xxx}},不需要添加safe
标签:
for 循环
{% for foo in t %}
{{foo}}
{{forloop}}
{% endfor %}
此处的forloop是 一个内置方法
if 判断
{% if flag %}
flag不为空
{% else %}
flag为空
{% endif %}
嵌套使用 当for循环对象l为空时,会触发empty代码块的内容
{% for foo in l %}
{% if forloop.first %}
<p>这是我的第一次</p>
{% elif forloop.last %}
<p>这是最后一次了啊</p>
{% else %}
<p>嗨起来!!!</p>
{% endif %}
{% empty %}
<p>你给我的容器类型是个空啊,没法for循环</p>
{% endfor %}
自定义过滤器、标签、inclusion_tag
前提:
1.在应用名下新建一个名为templatetags文件夹(必须叫这个名字)
2.在该新建的文件夹内新建一个任意名称的py文件
3.在该py文件中需要固定写下面两句代码
from django import template
register = template.Library()
一、自定义过滤器 前端只能传两个值,传多个值需要用可索引取值的python类型括起来,然后回去文件里做逻辑处理
@register.filter(name='xbb')
def index(a,b):
return a+b
在前端调用: {{110|xbb: 120}}
二、自定义标签
@register.simple_tag(name='heh')
def plus(a,b,c):
return a+b+c
在前端调用:{% heh 11 22 33%}
三、自定义inclusion_tag
@register.inclusion_tag('login.html',name='login') #第一个参数为调用的html页面
def login(n): #n为在另一个前端页面传入的参数
l = [ '第%s项'%i for i in range(n)] #列表推导式
return {'l':l} #将l返回给login.html页面
在login.html页面,可以只存在一段代码块即可:
<ul>
{% for foo in l %}
<li>{{ foo }}</li>
{% endfor %}
</ul>
在另外一个前端页面调用: {% login 10 %} #完成传值后,login.html页面代码块交由当前页面渲染执行。
需要注意:上述三者的调用时,需要事先加载所属的py文件 {% load xxx %}
模板的继承与导入
一:继承
首先需要在被继承的模板中划分多个区域 #模板名字为 home.html
{% block 取的名字 %} #名字选为 content
内部代码块
{% endblock %}
通常情况下,一个模板中至少有三块
{% block css %}
页面css代码块
{% endblock %}
{% block css %}
页面js代码块
{% endblock %}
{% block css %}
页面主体代码块
{% endblock %}
子板继承模板
1、先继承模板的所有内容
{% extends 'home.html' %}
2、再根据block块的名字修改指定区域的内容
{% block content %}
需要修改的代码
{% endblock %}
注:如果不想改变原始效果,可通过{{block.super()}} 来继续使用模板的样式
二:导入 将一段html当做模块的方式导入到另一个html展示
{% include '想导入的html文件名’ %}
静态文件配置
{% load static %}
<link rel='stylesheet' href="{% static 'css/mycss.css'%}"> # 第一种方式
<link rel='stylesheet' href="{% get_static_prefix %}css/mycss.css"> # 第二种方式