一、母板
1、什么情况下使用母版
当多个页面的大部分内容都一样的时候，我们可以把相同的部分提取出来，放到一个单独的母版HTML文件中
然后在母版中定义需要被替换的block
例如：母板页面
<!DOCTYPE html>
<html lang="zh-CN">
<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>母板HTML</title>
{% block page-css %}
{% endblock %}
</head>
<body>
<h1>母板内容</h1>
{% block page-main %}
{% endblock %}
<h1>JS</h1>
{% block page-js %}
{% endblock %}</body>
</html>
2、在子页面继承母板(相当于把母板所有代码复制过来)
{% extends ‘母板名.html‘ %}
3、块(block)
通过在母板中使用{% block xxx %}来定义"块"。
在子页面中通过定义母板中的block名来对应替换母板中相应的内容
注意：在母板中block只是定义，里面并没有内容的，子页面才填充内容
{% block page-main %}
<p>子页面的内容</p>
{% endblock %}
{% block page-js %}
<p>子页面的js</p>
<script src="/static/js/myjs.js"></script>
{% endblock %}
{% block page-css %}
<p>子页面的css</p>
<link rel="stylesheet" href="/static/css/mycss.css">
{% endblock %}
二、组件
1.、什么时候用组件？
页面上相对独立的某个部分可以单独拿出来放到一个单独的html文件中
2.、如何使用
1. {% inclue ‘组件.html‘ %}
三、静态文件相关
1. 为什么要使用
把静态文件的路径改成动态拼接的，避免在HTML页面中硬编码静态文件的导入路径
2. 如何使用
先导入static模块：{% load static %}
两种使用方法：
1. <link rel="stylesheet" href="{% static ‘bootstrap-3.3.7/css/bootstrap.css‘ %}">
2. <link rel="stylesheet" href="{% get_static_prefix %}font-awesome-4.7.0/css/font-awesome.css">
3、自定义simple_tag
和自定义filter类似，只不过接收更灵活的参数。
1. 自定义simple_tag的步骤
1. 在app下面新建一个python package名字叫templatetags
2. 在上一步的python package中新建一个py文件(my_extends.py)
3. 在py文件中写一个函数，实现自定义的simple_tag功能
4. 告诉Django我现在多了一个自定义的tag
5.例子
from django import template
from django.conf import settings
# 生成一个注册对象
register = template.Library()
# 自定义一个拼接静态文件路径的tag函数
@register.simple_tag(name=‘myst‘)
def my_static(s):
# 拿到settings.py中的STATIC_URL的值
s1 = settings.STATIC_URL
# 进行字符串拼接
ret = s1 + s
# 返回
return ret
2. 使用自定义的tag
1. 在HTML文件中导入刚才创建的py文件
{% load my_extends %}
2. 重启Django项目
3. 按照普通的tag调用自定义的函数
<link rel="stylesheet" href="{% myst ‘index/index.css‘ %}">
4、自定义inclusion_tag
多用于返回html代码片段
跟上面自定义的步骤一样，只是代码有点不同
inclusion_tag相当于定义了一个局部的HTML，然后别的页面可以引用这段HTML代码
例如：
my_extends.py
@register.inclusion_tag(filename=‘p.html‘, name=‘pp‘)
def my_p(num):
data = [i for i in range(1, num+1)]
return {‘data‘: data}
p.html
{% for i in data %}
<span>{{ i }}</span>
{% endfor %}
test.html
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta http-equiv="content-type" charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>test</title>
</head>
<body>
{% load my_extend %}
{% pp 10 %}
</body>
</html>
解释：
filename是inclusion_tag指定的页面，接收inclusion_tag函数返回值，name是调用时的tags名，
调用的参数是从my_p接收，返回的内容是filename指定的页面的内容。
也就是说，上面的代码，最终展示的页面是test.html，
{% load my_extend %}
{% pp 10 %}
上面两句话是导入了my_extend自定义的tags
pp是tags的具体一个方法，10是参数，pp会把10这个参数传给p.html，
最后在test,html页面显示p.html的那部分代码，相当于把p.html的代码嵌入到了test,html里面展示出来
原文地址：https://www.cnblogs.com/Zzbj/p/9898526.html
时间： 2024-10-04 18:27:54