當前位置：首頁 > 编程资源 > 编程问答 >内容正文

编程问答

Django 之母板

發布時間：2025/4/5 编程问答 29 豆豆

生活随笔收集整理的這篇文章主要介紹了 Django 之母板小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

---恢復內容開始---

母板

<!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塊，方便子頁面替換。

繼承母板

在子頁面中在頁面最上方使用下面的語法來繼承母板。

{% extends "base.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"><title>母板</title><style>*{padding: 0;margin: 0;}.head{height: 50px;width: 100%;background-color: deepskyblue;}.left{height: 1000px;width: 20%;background-color: darkgrey;float: left;}</style></head> <body> <div class="head">這是導航條</div> <div class="left">這是左側菜單</div>{# 母板是變的:右側內容#} {% block page_content%} {% endblock %}</body> </html> 共有的頁面 {% extends 'base.html' %} {#首先繼承母板#} {# extends 一定要放在最上面#} {% block page_content %}<table border="1px"><thead><tr><th>#</th><th>name</th><th>age</th></tr></thead><tbody><tr><td>1</td><td>jassin</td><td>21</td></tr><tr><td>2</td><td>lishi</td><td>21</td></tr><tr><td>3</td><td>dandan</td><td>35</td></tr></tbody></table>{% endblock %} studen_list，學生表 {% extends "base.html"%} {# 此處引用注意加引號#} {% block page_content %}<ul type="none" style="padding: 100px"><li>迷</li><li>失</li><li>歸</li><li>途</li><li>的</li><li>方</li><li>向</li></ul> {% endblock %} 不知道什么表 # views。py def student_list(request):return render(request, "student_list.html")def teacher_list(request):return render(request,"teacher_list.html")# urls。pyurl(r'^student_list/$',views.student_list),url(r'^teacher_list/$',views.teacher_list), 配置

塊（block）

通過在母板中使用{% block? xxx %}來定義"塊"。

在子頁面中通過定義母板中的block名來對應替換母板中相應的內容。

{% block page_content %}<ul type="none"><li>迷</li><li>失</li><li>歸</li><li>途</li><li>的</li><li>方</li><li>向</li></ul> {% endblock %} 把所有頁面共用的部分提取出來放到母版里面母版里面通過定義 block ，通常模板里面為子頁面單獨定義{% block page_css %}{% endblock %} --> 子頁面才用到的CSS文件{% block page_js %}{% endblock %} --> 子頁面采用到的JS文件子頁面繼承 {% extends "base.html" %} --》一定要放在子頁面的最上面{% block page_content %}我子頁面才有的內容{% endblock %}

組件

可以將常用的頁面內容如導航條，頁尾信息等組件保存在單獨的文件中，然后在需要使用的地方按如下語法導入即可。（導入組件）

{% include 'navbar.html' %}

?靜態文件相關（實現動態）

在setting.py 中 STATIC_URL = '/static/' 的static是可以改變# 所以我們也要把他實現為動態傳. 首先需要先 {% load static %} 導入然后使用例如 <img src="/static/images/hi.jpg" alt="Hi!"> # 這個已經寫死<img src"{% static "images/hi.jpg" %}" alt="Hi!" /> 實現動態此處static 已經將static 導入，與 STATIC_URL = '/static/' 的static別名無關

引用JS文件時使用：

{% load static %} <script src="{% static "mytest.js" %}"></script>

某個文件多處被用到可以存為一個變量

{% load static %} {% static "images/hi.jpg" as myphoto %} <img src="{{ myphoto }}"></img>

?使用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（未講）

和自定義filter類似，只不過接收更靈活的參數。

定義注冊simple tag

@register.simple_tag(name="plus") def plus(a, b, c):return "{} + {} + {}".format(a, b, c)

使用自定義simple tag

{% load app01_demo %}{# simple tag #} {% plus "1" "2" "abc" %}

轉載于:https://www.cnblogs.com/jassin-du/p/8318106.html

總結

以上是生活随笔為你收集整理的Django 之母板的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。