Django之模板語言
目錄
一、簡介
模版語言出現的原因：
1、對頁面設計進行的任何改變都必須對 Python 程式碼進行相應的修改。 站點設計的修改往往比底層 Python 程式碼的修改要頻繁得多，因此如果可以在不進行 Python 程式碼修改的情況下變更設計，那將會方便得多。
2、Python 程式碼編寫和 HTML 設計是兩項不同的工作，大多數專業的網站開發環境都將他們分配給不同的人員（甚至不同部門）來完成。 設計者和HTML/CSS的編碼人員不應該被要求去編輯Python的程式碼來完成他們的工作。
3、程式設計師編寫 Python程式碼和設計人員製作模板兩項工作同時進行的效率是最高的，遠勝於讓一個人等待另一個人完成對某個既包含 Python又包含 HTML 的檔案的編輯工作。
基於這些原因，將頁面的設計和Python的程式碼分離開會更乾淨簡潔更容易維護。 我們可以使用 Django的 模板系統 (Template System)來實現這種模式
語法
只需要記兩種特殊符號：
{{ }} 和 {% %}
變數相關的用{{ }}，邏輯相關的用{% %}
二、模板變數
在 Django 模板中遍歷複雜資料結構的關鍵是句點字元, 語法：｛｛變數名｝｝
def template_test(request): name = 'wwl' li = ['wwl', 1, '18'] dic = {'name': 'wwl', 'age': 18} ll2 = [ {'name': 'wwl', 'age': 18}, {'name': 'wwl2', 'age': 19}, ] ll3=[] class Person: def __init__(self, name): self.nameviews.py= name def test(self): print('test函式') return 11 @classmethod def test_classmethod(cls): print('類方法') return '類方法' @staticmethod def static_method(): print('靜態方法') return '靜態方法' wwl = Person('wwl') xxx = Person('xxx') person_list = [wwl, xxx] bo = True te = test() import datetime now=datetime.datetime.now() link1='<a href="https://www.baidu.com">點我<a>' from django.utils import safestring link=safestring.mark_safe(link1) # html特殊符號對照表（http://tool.chinaz.com/Tools/htmlchar.aspx） # 這樣傳到前臺不會變成特殊字元，因為django給處理了 dot='♠' # return render(request, 'template_index.html', {'name':name,'person_list':person_list}) return render(request, 'template_index.html', locals())
<p>{{ name }}</p>
<p>{{ li }}</p>
<p>{{ dic }}</p>
<p>{{ wwl }}</p>
<p>{{ person_list }}</p>
<p>{{ bo }}</p>
<p>{{ te }}</p>
<hr>
<h3>深度查詢句點符</h3>
<p>{{ li.1 }}</p>
<p>{{ dic.name }}</p>
<p>{{ wwl.test }}</p>
<p>{{ wwl.name }}</p>
<p>{{ person_list.0 }}</p>
<p>{{ person_list.1.name }}</p>
<hr>
<h3>過濾器</h3>
{#注意：冒號後面不能加空格#}
<p>{{ now | date:"Y-m-d H:i:s" }}</p>
{#如果變數為空，設定預設值,空資料，None，變數不存在，都適用#}
<p>{{ name |default:'資料為空' }}</p>
{#計算長度，只有一個引數#}
<p>{{ person_list |length }}</p>
{#計算檔案大小#}
<p>{{ 1024 |filesizeformat }}</p>
{#字串切片，前閉後開，前面取到，後面取不到#}
<p>{{ 'hello world wwl' |slice:"2:-1" }}</p>
<p>{{ 'hello world wwl' |slice:"2:5" }}</p>
{#截斷字元，至少三個起步，因為會有三個省略號（傳負數，1，2，3都是三個省略號）#}
<p>{{ '伍萬磊 world wwl' |truncatechars:"4" }}</p>
{#截斷文字，以空格做區分，這個不算省略號#}
<p>{{ '伍萬磊 是 大帥比 謝謝' |truncatewords:"1" }}</p>
<p>{{ link1 }}</p>
<p>{{ link1|safe }}</p>
<p>{{ link }}</p>
<p>♠</p>
<p>{{ dot }}</p>
{#add 可以加負數，傳數字字串都可以#}
<p>{{ "10"|add:"-2" }}</p>
<p>{{ li.1|add:"-2" }}</p>
<p>{{ li.1|add:2 }}</p>
<p>{{ li.1|add:"2" }}</p>
<p>{{ li.1|add:"-2e" }}</p>
{#upper#}
<p>{{ name|upper }}</p>
<p>{{ 'WWL'|lower }}</p>
<hr>
<h3>模版語法之標籤</h3>
{#for 迴圈 迴圈列表，迴圈字典，迴圈列表物件#}
<ui>
{% for foo in dic %}
{{ foo }}
{% endfor %}
{#也可以混用html標籤#}
{% for foo in li %}
<ul>foo</ul>
{% endfor %}
</ui>
{#表格#}
<table border="1">
{% for foo in ll2 %}
<tr>
<td>{{ foo.name }}</td>
<td>{{ foo.age }}</td>
</tr>
{% endfor %}
</table>
<table border="1">
{#'parentloop': {}, 'counter0': 0, 'counter': 1, 'revcounter': 4, 'revcounter0': 3, 'first': True, 'last': False}#}
{% for foo in ll2 %}
<tr>
<td>{{ forloop.counter }}</td>
<td>{{ foo.name }}</td>
<td>{{ foo.age }}</td>
</tr>
{% endfor %}
</table>
{% for foo in ll5 %}
<p>foo.name</p>
{% empty %}
<p>空的</p>
{% endfor %}
<hr>
<h3>if判斷</h3>
{% if name %}
<a href="">hi {{ name }}</a>
<a href="">登出</a>
{% else %}
<a href="">請登入</a>
<a href="">註冊</a>
{% endif %}
{#還有elif#}
<hr>
<h3>with</h3>
{% with ll2.0.name as n %}
{{ n }}
{% endwith %}
{{ n }}
{% load my_tag_filter %}
{{ 3|multi_filter:3 }}
{#傳參必須用空格區分#}
{% multi_tag 3 9 10 %}
{#可以跟if連用#}
{% if 3|multi_filter:3 > 9 %}
<p>大於</p>
{% else %}
<p>小於</p>
{% endif %}
html
注意
{{ }} 相當於執行了print 深度查詢：如果是方法，不能加括號，不能傳引數變數渲染:{{ 變數 }}
變數深度查詢:{{ 變數.索引/key值/方法 }}
三、模板過濾器
語法
後面只能傳一個引數
{ { 變數 | 過濾器的名字：‘引數’ } }
常用過濾器：
add
給value加上一個值
{{ user.age | add:”5” }}
default
如果一個變數是false或者為空，使用給定的預設值。 否則，使用變數的值。
{{ value|default:"nothing"}}
如果value沒有傳值或者值為空的話就顯示nothing
length
返回值的長度，作用於字串和列表。
{{ value|length }}
返回value的長度，如 value=['a', 'b', 'c', 'd']的話，就顯示4.
filesizeformat
將值格式化為一個 “人類可讀的” 檔案尺寸 （例如 '13 KB', '4.1 MB', '102 bytes', 等等）。例如：
{{ value|filesizeformat }}
如果 value 是 123456789，輸出將會是 117.7 MB。
slice
{{value|slice:"2:-1"}} 切片
date
{{ value|date:"Y-m-d H:i:s"}} 格式化
safe 慎重，注意xss跨站指令碼攻擊
Django的模板中會對HTML標籤和JS等語法標籤進行自動轉義，原因顯而易見，這樣是為了安全。但是有的時候我們可能不希望這些HTML元素被轉義，比如我們做一個內容管理系統，後臺新增的文章中是經過修飾的，這些修飾可能是通過一個類似於FCKeditor編輯加註了HTML修飾符的文字，如果自動轉義的話顯示的就是保護HTML標籤的原始檔。為了在Django中關閉HTML的自動轉義有兩種方式，如果是一個單獨的變數我們可以通過過濾器“|safe”的方式告訴Django這段程式碼是安全的不必轉義。
比如：
value = "<a href='#'>點我</a>"
{{ value|safe}}
truncatechars
如果字串字元多於指定的字元數量，那麼會被截斷。截斷的字串將以可翻譯的省略號序列（“...”）結尾。
{{ value|truncatechars:9}} 引數：截斷的字元數
truncatewords
{{ value|truncatewords:9}} 在一定數量的字後截斷字串。
cut
{{ value|cut:' ' }} 移除value中所有的與給出的變數相同的字串
如果value為'i love you'，那麼將輸出'iloveyou'.
join
使用字串連線列表，例如Python的str.join(list)
timesince
將日期格式設為自該日期起的時間（例如，“4天，6小時”）。
採用一個可選引數，它是一個包含用作比較點的日期的變數（不帶引數，比較點為現在）。 例如，如果blog_date是表示2006年6月1日午夜的日期例項，並且comment_date是2006年6月1日08:00的日期例項，則以下將返回“8小時”：
{{ blog_date|timesince:comment_date }}
分鐘是所使用的最小單位，對於相對於比較點的未來的任何日期，將返回“0分鐘”。
timeuntil
似於timesince，除了它測量從現在開始直到給定日期或日期時間的時間。 例如，如果今天是2006年6月1日，而conference_date是保留2006年6月29日的日期例項，則{{ conference_date | timeuntil }}將返回“4周”。
使用可選引數，它是一個包含用作比較點的日期（而不是現在）的變數。 如果from_date包含2006年6月22日，則以下內容將返回“1周”：
{{ conference_date|timeuntil:from_date }}
四、模板標籤
for迴圈
普通for迴圈 {% for i in 可迭代物件%}
<ul>
{% for user in user_list %}
<li>{{ user.name }}</li>
{% endfor %}
</ul>
for迴圈可用的一些引數：
for ... empty
<ul>
{% for user in user_list %}
<li>{{ user.name }}</li>
{% empty %}
<li>空空如也</li>
{% endfor %}
</ul>
if判斷
if,elif和else
{% if user_list %}
使用者人數：{{ user_list|length }}
{% elif black_list %}
黑名單數：{{ black_list|length }}
{% else %}
沒有使用者
{% endif %}
當然也可以只有if和else
{% if user_list|length > 5 %}
七座豪華SUV
{% else %}
黃包車
{% endif %}
if語句支援 and 、or、==、>、<、!=、<=、>=、in、not in、is、is not判斷。
with
定義一箇中間變數，多用於給一個複雜的變數起別名。
注意等號左右不要加空格。
{% with total=business.employees.count %}
{{ total }} employee{{ total|pluralize }}
{% endwith %}
或
{% with business.employees.count as total %}
{{ total }} employee{{ total|pluralize }}
{% endwith %}
csrf_token
這個標籤用於跨站請求偽造保護。
在頁面的form表單裡面寫上{% csrf_token %}
註釋
{# ... #}
注意事項
1. Django的模板語言不支援連續判斷，即不支援以下寫法：
{% if a > b > c %}
...
{% endif %}
2. Django的模板語言中屬性的優先順序大於方法
def xx(request):
d = {"a": 1, "b": 2, "c": 3, "items": "100"}
return render(request, "xx.html", {"data": d})
如上，我們在使用render方法渲染一個頁面的時候，傳的字典d有一個key是items並且還有預設的 d.items() 方法，此時在模板語言中:
{{ data.items }}
預設會取d的items key的值。
五、自定義過濾器
自定義過濾器只是帶有一個或兩個引數的Python函式:
-
變數（輸入）的值 - -不一定是一個字串
-
引數的值 - 這可以有一個預設值，或完全省略
例如，在過濾器{{var | foo:'bar'}}中，過濾器foo將傳遞變數var和引數“bar”。
自定義filter程式碼檔案擺放位置：
app01/
__init__.py
models.py
templatetags/ # 在app01下面新建一個package package
__init__.py
app01_filters.py # 建一個存放自定義filter的檔案
views.py
編寫自定義filter
from django import template
register = template.Library()
@register.filter(name="cut")
def cut(value, arg):
return value.replace(arg, "")
@register.filter(name="addSB")
def add_sb(value):
return "{} SB".format(value)
使用自定義filter
{# 先匯入我們自定義filter那個檔案 #}
{% load app01_filters %}
{# 使用我們自定義的filter #}
{{ somevariable|cut:"0" }}
{{ d.name|addSB }}
conclusion
1 確認app是否在settings中註冊 2 在app下建立templatetags的模組(名字固定) 3 在模組下建立py檔案(名字隨意)--->在模板中{% load py檔名字%} 4 在py檔案中寫過濾器 from django.template import Library register = Library() #指定了name之後,模板上使用的時候,直接用name呼叫,如果沒指定name,就用函式的名字 # 過濾器最多有兩個引數 @register.filter(name='myadd')
def my_add(a,b): print(a+b) return a+b 5 模板中使用 -1 {% load py檔名字%} -2 {{ 變數|myadd:1}}
六、自定義標籤
1 確認app是否在settings中註冊 2 在app下建立templatetags的模組(名字固定) 3 在模組下建立py檔案(名字隨意)--->在模板中{% load py檔名字%} 4 在py檔案中寫標籤 from django.template import Library register = Library() #指定了name之後,模板上使用的時候,直接用name呼叫,如果沒指定name,就用函式的名字 # 標籤可以有多個引數 @register.simple_tag(name='mytag') def my_tag(a,b,c): return a+b+c 5 模板中使用 -1 {% load py檔名字%} -2 {% mytag 引數1 引數2 引數3%}
標籤和過濾器的區別:
1 標籤可以傳多個引數,過濾器最多隻能傳2個 2 使用過濾器{{ }} 標籤使用:{% %} 3 **重點:過濾器可以放在if判斷後,標籤不能放在if判斷後
七、模版匯入和繼承
母板
<!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 'layouts.html' %}
塊（block）
通過在母板中使用{% block xxx %}來定義"塊"。
在子頁面中通過定義母板中的block名來對應替換母板中相應的內容。
{% block page-main %}
<p>上海</p>
<p>北京</p>
<p>深圳</p>
{% endblock %}
元件
可以將常用的頁面內容如導航條，頁尾資訊等元件儲存在單獨的檔案中，然後在需要使用的地方按如下語法匯入即可。
{% include 'navbar.html' %}
如果你在模版中使用 {% extends %} 標籤，它必須是模版中的第一個標籤。其他的任何情況下，模版繼承都將無法工作。
在base模版中設定越多的 {% block %} 標籤越好。請記住，子模版不必定義全部父模版中的blocks，所以，你可以在大多數blocks中填充合理的預設內容，然後，只定義你需要的那一個。多一點鉤子總比少一點好。
如果你發現你自己在大量的模版中複製內容，那可能意味著你應該把內容移動到父模版中的一個 {% block %} 中。
If you need to get the content of the block from the parent template, the {{ block.super }} variable will do the trick. This is useful if you want to add to the contents of a parent block instead of completely overriding it. Data inserted using {{ block.super }} will not be automatically escaped (see the next section), since it was already escaped, if necessary, in the parent template.
為了更好的可讀性，你也可以給你的 {% endblock %} 標籤一個 名字 。例如：
{% block content %}
...
{% endblock content %}
在大型模版中，這個方法幫你清楚的看到哪一個 {% block %} 標籤被關閉了。
不能在一個模版中定義多個相同名字的 block 標籤。
使用繼承的一些提升
八、靜態檔案相關
{% static %}
{% load static %}
<img src="{% static "images/hi.jpg" %}" alt="Hi!" />
引用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!" />
inclusion_tag
多用於返回html程式碼片段
示例：
templatetags/my_inclusion.py
from django import template
register = template.Library()
@register.inclusion_tag('result.html')
def show_results(n):
n = 1 if n < 1 else int(n)
data = ["第{}項".format(i) for i in range(1, n+1)]
return {"data": data}
templates/snippets/result.html
<ul>
{% for choice in data %}
<li>{{ choice }}</li>
{% endfor %}
</ul>
templates/index.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>inclusion_tag test</title>
</head>
<body>
{% load inclusion_tag_test %}
{% show_results 10 %}
</body>
</html>