Day61 Django框架--模板语言2
一,母板
1.什么情况下使用母板?
当多个页面的大部分内容都一样的时候,我们可以把相同的部分提取出来,放到一个单独的母板文件中
2.使用母板
0.通常用法:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="x-ua-compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Title</title> {% block page-css %} {% endblock %} </head> <body> <h1>这是母板的标题</h1> {% block page-main %} {% endblock %} <h1>母板底部内容</h1> {% block page-js %} {% endblock %} </body> </html>
注意:我们通常会在母板中定义页面专用的CSS块和JS块,方便子页面替换
1.继承母板
在子页面中在页面最上方使用下面的语法来继承母版
{% extends '母板.html' %}
2.定义块(block)
通过在母板中使用{% block xxx %}来定义"块"
在子页面中通过定义母板中的block名来对应替换母板中相应的内容
{% block page-main %} <p>世情薄</p> <p>人情恶</p> <p>雨送黄昏花易落</p> {% endblock %}
二,组件
1.什么时候用组件?
页面上相对独立的某个部分可以单独拿出来放到一个单独的html文件中
2.如何使用
在需要导入组件的地方加一句
{% include '组件.html' %}
三,静态文件相关
1.为什么要使用动态拼接的路径?
把静态文件的路径改成动态拼接的,避免在HTML页面中硬编码静态的导入路径(就是不要写死了)
2.使用方法
{# 引用JS文件时使用 #} {% load static %} <script src="{% static "mytest.js" %}"></script> {# 引用图片时 #} {% load static %} <img src="{% static "images/hi.jpg" %}" alt="Hi!" /> {# 某个文件多处被用到可以存为一个变量 #} {% load static %} {% static "images/hi.jpg" as myphoto %} <img src="{{ myphoto }}"></img>
3.使用get_static_prefix
{% load static %} <img src="{% get_static_prefix %}images/hi.jpg" alt="Hi!" /> {% load static %} {% get_static_prefix as STATIC_PREFIX %} <img src="{{ STATIC_PREFIX }}images/hi.jpg" alt="Hi!" /> <img src="{{ STATIC_PREFIX }}images/hi2.jpg" alt="Hello!" />
四,自定义simpletag
自定义tag比自定义filter功能更强大一点,可以接收更灵活的参数
1.定义注册simple tag
@register.simple_tag(name="plus")
def plus(a, b, c):
return "{} + {} + {}".format(a, b, c)
2.使用自定义simple tag
{% load app01_demo %}
{# 调用plus并传参 #}
{% plus "1" "2" "abc" %}
五,inclusion_tag:多用于返回html代码片段
例子:
1.用于替换的HTML代码片段
<nav aria-label="Page navigation"> <ul class="pagination"> <li> <a href="#" aria-label="Previous"> <span aria-hidden="true">«</span> </a> </li> {% for i in data %} <li><a href="#">{{ i }}</a></li> {% endfor %} <li> <a href="#" aria-label="Next"> <span aria-hidden="true">»</span> </a> </li> </ul> </nav>
2.HTML中调用自定义的tag --page
<html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> {% load static %} <link rel="stylesheet" href="{% static 'bootstrap-3.3.7/css/bootstrap.css' %}"> </head> <body> <h1>自定义的simple_tag示例</h1> {% load my_extends %} {# 导入my_extends.py #} {% page 5 %} {% page 10 %} {% page 100 %} </body> </html>
2.templatetags\my_extends.py中的tag函数
from django import template register = template.Library() @register.inclusion_tag(filename='xx.html', name='page') def my_page(num): data = [i for i in range(1, num+1)] return {'data': data}
2.views.py
def t(request): return render(request, 't.html')