Django-8-模板层过滤器和继承

过滤器

模板层对变量的操作实际还有很多,过滤器就是其中一种。学过Linux系统的一定知道管道操作符,其可以将上一步输出直接作为下一步输入进行处理,这里的过滤器就是类似管道符,其写法也是以管道符|为标志,允许我们对模板层获得的变量进行改变,例如大小写转换、增减大小等等

  • 语法
{{ 变量|过滤器1|过滤器2:'值' |...}}

这里的过滤器可以分为两类,一类是不带参数的,例如lower,upper,safe;一类是带参数的add:'10',冒号分隔,后面跟上值

过滤器示例说明
lower{{strlower}}
upper{{strupper}}
safe{{scriptsafe}}
add{{numadd:‘10’}}
示例:
views.py
def home(request):

    dic = {}
    dic['str'] = 'abc'
    dic['num'] = 90
    dic['script'] = '<script>alert("这是测试过滤器safe")</script>' #简单的js代码,可以弹出一个窗口
    return render(request, 'home.html', dic)

home.html

<body>
    <h2>过滤器upper: {{ str|upper }}</h2> # 全变成大写字母
    <h2>过滤器add: {{ num|add:'10' }}</h2> # 加10
    <h2>过滤器safe: {{ script|safe }}</h2> # 不进行html转义,适用直接执行js代码,理解为代码安全可以直接执行
</body>

在这里插入图片描述

在这里插入图片描述
如果不适用safe则输出原始字符串,不会执行js代码
在这里插入图片描述

  • 除了以上过滤器,更多过滤器请参见https://docs.djangoproject.com/zh-hans/3.2/ref/templates/builtins

继承-清爽的html代码

对于某个网站来说,一般具有比较统一的风格,例如无论点击网页哪个标签或者链接,导航栏和尾部都是基本一样的内容,另外网页的css/js也基本是一样的,真正变的是中间的内容区域,如果按照之前的方法,每次创建一个页面都从头写,将是非常冗余的。有没有办法在创建新的页面的时候可以复用之前页面某些部分,而又可以同时个性化定制不同的部分呢?这就是django中模板继承的概念。
例如,有如下页面,由三部分组成,第一块是导航栏,无论哪个子页面均是一样,中间body区会因为点击导航栏不同项目发生变化,而最后一块尾部每个页面都是一样,如何实现上述要求呢?
在这里插入图片描述

  • 求同:Django模板层通过{% extends 'home.html' %}实现子页面对父页面home.html的继承,也就是说只需要在每个子页面写上该行代码即能完成对父页面的继承,但是需要注意的是不能继承父页面的传入的对应视图函数的变量。
  • 存异:在父页面(home.html)中使用{% block block_name %}...{% endblock block_name(可选) %}标记块,凡是在标记块中的内容在子页面都可以被修改,修改方法是在{% block block_name %}子页面重写内容{% endblock block_name(可选) %}块中重新更改内容即可。这个很好理解,我们首先在父页面定义好哪些可以个性化定制,使用不同的block名称来索引区分,而任意子页面一旦extends父页面,则可以根据名称来个性化修改。
    home.html
<!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.0">
</head>

<body>
    <!-- 导航栏,每个页面都一样 -->
    <h2>
        <a href="/home">主页</a>
        <a href="/music">音乐频道</a>
        <a href="/sport">运动频道</a>
    </h2>
    <h2>
        {% block body %}
        <h2>欢迎来到主页!(该部分区域因页面而异)</h2>
        {% endblock %}
        <h3>如有问题请请联系xxx@163.com(每个页面都一样)</h3>
</body>

</html>

music.html

{% extends 'home.html' %}

<!-- 修改body区域内容 -->
{% block body %}
<h2>欢迎来到音乐频道!</h2>
{% endblock %}

sport.html

{% extends 'home.html' %}

<!-- 修改body区域内容 -->
{% block body %}
<h2>欢迎来到运动频道!</h2>
{% endblock %}

views.py

import re
from django.http import HttpResponse
from django.shortcuts import render


def home(request):
    return render(request, 'home.html', dic)


def music(request):

    return render(request, 'music.html')


def sport(request):

    return render(request, 'sport.html')

urls.py

from django.contrib import admin
from django.urls import path
from . import views
urlpatterns = [
    path('admin/', admin.site.urls),
    path('home/', views.home),
    path('music/', views.music),
    path('sport/', views.sport),
]

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
学到这里,大家又可以小激动一下了,一个静态网页的基本架构慢慢成熟起来,将一个主页应用到其他页面,同时又保持其他页面的差异,django的模板思想越来越清晰了。

总结

  • 父页面通过{% block mark %} ... {% endblock %}来标记哪些html代码可以个性化定制
  • 子页面通过{% extends 'father.html' %}来继承父页面
  • 模版继承使得大大节省了相关html代码,在保证灵活的功能下同时保持代码的清爽

参考

达内教育

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值