一 模版簡介
你可能已經注意到咱們在例子視圖中返回文本的方式有點特別。 也就是說,HTML被直接硬編碼在 Python代碼之中。css
def current_datetime(request): now = datetime.datetime.now() html = "<html><body>It is now %s.</body></html>" % now return HttpResponse(html)
儘管這種技術便於解釋視圖是如何工做的,但直接將HTML硬編碼到你的視圖裏卻並非一個好主意。 讓咱們來看一下爲何:html
-
對頁面設計進行的任何改變都必須對 Python 代碼進行相應的修改。 站點設計的修改每每比底層 Python 代碼的修改要頻繁得多,所以若是能夠在不進行 Python 代碼修改的狀況下變動設計,那將會方便得多。python
-
Python 代碼編寫和 HTML 設計是兩項不一樣的工做,大多數專業的網站開發環境都將他們分配給不一樣的人員(甚至不一樣部門)來完成。 設計者和HTML/CSS的編碼人員不該該被要求去編輯Python的代碼來完成他們的工做。git
-
程序員編寫 Python代碼和設計人員製做模板兩項工做同時進行的效率是最高的,遠勝於讓一我的等待另外一我的完成對某個既包含 Python又包含 HTML 的文件的編輯工做。程序員
基於這些緣由,將頁面的設計和Python的代碼分離開會更乾淨簡潔更容易維護。 咱們可使用 Django的 模板系統 (Template System)來實現這種模式,這就是本章要具體討論的問題數據庫
python的模板:HTML代碼+模板語法
django
def current_time(req): # ================================原始的視圖函數 # import datetime # now=datetime.datetime.now() # html="<html><body>如今時刻:<h1>%s.</h1></body></html>" %now # ================================django模板修改的視圖函數 # from django.template import Template,Context # now=datetime.datetime.now() # t=Template('<html><body>如今時刻是:<h1>{{current_date}}</h1></body></html>') # #t=get_template('current_datetime.html') # c=Context({'current_date':str(now)}) # html=t.render(c) # # return HttpResponse(html) #另外一種寫法(推薦) import datetime now=datetime.datetime.now() return render(req, 'current_datetime.html', {'current_date':str(now)[:19]})
模版語法重點:bootstrap
變量:{{ 變量名 }}緩存
1 深度查詢 用句點符安全
2 過濾器
標籤:{{% % }}
二 模版語法之變量
在 Django 模板中遍歷複雜數據結構的關鍵是句點字符, 語法:{{變量名}}
views.py
def template_test(request): name = 'lqz' li = ['lqz', 1, '18'] dic = {'name': 'lqz', 'age': 18} ll2 = [ {'name': 'lqz', 'age': 18}, {'name': 'lqz2', 'age': 19}, {'name': 'egon', 'age': 20}, {'name': 'kevin', 'age': 23} ] ll3=[] class Person: def __init__(self, name): self.name = name def test(self): print('test函數') return 11 @classmethod def test_classmethod(cls): print('類方法') return '類方法' @staticmethod def static_method(): print('靜態方法') return '靜態方法' lqz = Person('lqz') egon = Person('egon') person_list = [lqz, egon] 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())
html
<p>{{ name }}</p> <p>{{ li }}</p> <p>{{ dic }}</p> <p>{{ lqz }}</p> <p>{{ person_list }}</p> <p>{{ bo }}</p> <p>{{ te }}</p> <hr> <h3>深度查詢句點符</h3> <p>{{ li.1 }}</p> <p>{{ dic.name }}</p> <p>{{ lqz.test }}</p> <p>{{ lqz.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 lqz' |slice:"2:-1" }}</p> <p>{{ 'hello world lqz' |slice:"2:5" }}</p> {#截斷字符,至少三個起步,由於會有三個省略號(傳負數,1,2,3都是三個省略號)#} <p>{{ '劉清政 world lqz' |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>{{ 'LQZ'|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 %}
注意:句點符也能夠用來引用對象的方法(無參數方法):
<h4>字典:{{ dic.name.upper }}<
/
h4>
三 模版之過濾器
語法:
{{obj|filter__name:param}} 變量名字|過濾器名稱:變量
default
若是一個變量是false或者爲空,使用給定的默認值。不然,使用變量的值。例如:
{{ value|default:
"nothing"
}}
length
返回值的長度。它對字符串和列表都起做用。例如:
{{ value|length }}
若是 value 是 ['a', 'b', 'c', 'd'],那麼輸出是 4。
filesizeformat
將值格式化爲一個 「人類可讀的」 文件尺寸 (例如 '13 KB'
, '4.1 MB'
, '102 bytes'
, 等等)。例如:
{{ value|filesizeformat }}
若是 value
是 123456789,輸出將會是 117.7 MB
。
date
若是 value=datetime.datetime.now()
{{ value|date:
"Y-m-d H:i:s
"
}}
slice
若是 value="hello world"
{{ value|
slice
:
"2:-1"
}}
truncatechars
若是字符串字符多於指定的字符數量,那麼會被截斷。截斷的字符串將以可翻譯的省略號序列(「...」)結尾。
參數:要截斷的字符數
例如:
{{ value|truncatechars:
9
}}
safe
Django的模板中會對HTML標籤和JS等語法標籤進行自動轉義,緣由顯而易見,這樣是爲了安全。可是有的時候咱們可能不但願這些HTML元素被轉義,好比咱們作一個內容管理系統,後臺添加的文章中是通過修飾的,這些修飾多是經過一個相似於FCKeditor編輯加註了HTML修飾符的文本,若是自動轉義的話顯示的就是保護HTML標籤的源文件。爲了在Django中關閉HTML的自動轉義有兩種方式,若是是一個單獨的變量咱們能夠經過過濾器「|safe」的方式告訴Django這段代碼是安全的沒必要轉義。好比:
value
=
"<a href="
">點擊</a>"
{{ value|safe}}
其它過濾器(瞭解)
過濾器 描述 示例 upper 以大寫方式輸出
{{ user.name | upper }}
add 給value加上一個數值
{{ user.age | add:」5」 }}
addslashes 單引號加上轉義號 capfirst 第一個字母大寫
{{ ‘good’| capfirst }} 返回」Good」
center 輸出指定長度的字符串,把變量居中
{{ 「abcd」| center:」50」 }}
cut 刪除指定字符串
{{ 「You are not a Englishman」 | cut:」not」 }} date 格式化日期 default 若是值不存在,則使用默認值代替
{{ value | default:」(N/A)」 }}
default_if_none 若是值爲None, 則使用默認值代替 dictsort 按某字段排序,變量必須是一個dictionary
{% for moment in moments | dictsort:」id」 %}
dictsortreversed 按某字段倒序排序,變量必須是dictionary
divisibleby 判斷是否能夠被數字整除
{{ 224 | divisibleby:2 }} 返回 True
escape 按HTML轉義,好比將」<」轉換爲」<」 filesizeformat 增長數字的可讀性,轉換結果爲13KB,89MB,3Bytes等
{{ 1024 | filesizeformat }} 返回 1.0KB
first 返回列表的第1個元素,變量必須是一個列表
floatformat 轉換爲指定精度的小數,默認保留1位小數
{{ 3.1415926 | floatformat:3 }} 返回 3.142 四捨五入
get_digit 從個位數開始截取指定位置的數字
{{ 123456 | get_digit:’1’}}
join 用指定分隔符鏈接列表
{{ [‘abc’,’45’] | join:’*’ }} 返回 abc*45
length 返回列表中元素的個數或字符串長度
length_is 檢查列表,字符串長度是否符合指定的值
{{ ‘hello’| length_is:’3’ }}
linebreaks 用<p>或<br>標籤包裹變量
{{ 「Hi\n\nDavid」|linebreaks }} 返回<p>Hi</p><p>David</p>
linebreaksbr 用<br/>標籤代替換行符
linenumbers 爲變量中的每一行加上行號
ljust 輸出指定長度的字符串,變量左對齊
{{‘ab’|ljust:5}}返回 ‘ab ’
lower 字符串變小寫
make_list 將字符串轉換爲列表
pluralize 根據數字肯定是否輸出英文複數符號
random 返回列表的隨機一項
removetags 刪除字符串中指定的HTML標記
{{value | removetags: 「h1 h2」}}
rjust 輸出指定長度的字符串,變量右對齊
slice 切片操做, 返回列表
{{[3,9,1] | slice:’:2’}} 返回 [3,9]
{{ 'asdikfjhihgie' | slice:':5' }} 返回 ‘asdik’
slugify 在字符串中留下減號和下劃線,其它符號刪除,空格用減號替換 {{ '5-2=3and5 2=3' | slugify }} 返回 5-23and5-23
stringformat 字符串格式化,語法同python
time 返回日期的時間部分
timesince 以「到如今爲止過了多長時間」顯示時間變量
結果可能爲 45days, 3 hours
timeuntil 以「從如今開始到時間變量」還有多長時間顯示時間變量
title 每一個單詞首字母大寫
truncatewords 將字符串轉換爲省略表達方式 {{ 'This is a pen' | truncatewords:2 }}返回 This is ... truncatewords_html 同上,但保留其中的HTML標籤 {{ '<p>This is a pen</p>' | truncatewords:2 }}返回 <p>This is ...</p>
urlencode 將字符串中的特殊字符轉換爲url兼容表達方式
{{ ‘http://www.aaa.com/foo?a=b&b=c’ | urlencode}}
urlize 將變量字符串中的url由純文本變爲連接
wordcount 返回變量字符串中的單詞數
yesno 將布爾變量轉換爲字符串yes, no 或maybe {{ True | yesno }} {{ False | yesno }} {{ None | yesno }} 返回 yes no maybe
四 模版之標籤
標籤看起來像是這樣的: {% tag %}
。標籤比變量更加複雜:一些在輸出中建立文本,一些經過循環或邏輯來控制流程,一些加載其後的變量將使用到的額外信息到模版中。一些標籤須要開始和結束標籤 (例如{% tag %} ...
標籤 內容 ... {% endtag %})。
for標籤
遍歷每個元素:
{% for person in person_list %}
<p>{{ person.name }}</p> {% endfor %}
能夠利用{% for obj in list reversed %}反向完成循環。
遍歷一個字典:
{% for key,val in dic.items %}
<p>{{ key }}:{{ val }}</p> {% endfor %}
注:循環序號能夠經過{{forloop}}顯示
forloop.counter The current iteration of the loop (1-indexed)
forloop.counter0 The current iteration of the loop (0-indexed) forloop.revcounter The number of iterations from the end of the loop (1-indexed) forloop.revcounter0 The number of iterations from the end of the loop (0-indexed) forloop.first True if this is the first time through the loop forloop.last True if this is the last time through the loop
for ... empty
for 標籤帶有一個可選的{% empty %} 從句,以便在給出的組是空的或者沒有被找到時,能夠有所操做。
{% for person in person_list %}
<p>{{ person.name }}</p> {% empty %} <p>sorry,no person here</p> {% endfor %}
if 標籤
{% if %}會對一個變量求值,若是它的值是「True」(存在、不爲空、且不是boolean類型的false值),對應的內容塊會輸出。
{% if num > 100 or num < 0 %} <p>無效</p> {% elif num > 80 and num < 100 %} <p>優秀</p> {% else %} <p>湊活吧</p> {% endif %}
with
使用一個簡單地名字緩存一個複雜的變量,當你須要使用一個「昂貴的」方法(好比訪問數據庫)不少次的時候是很是有用的
例如:
{% with total=business.employees.count %}
{{ total }} employee{{ total|pluralize }}
{% endwith %}
csrf_token
{% csrf_token%}
這個標籤用於跨站請求僞造保護
五 自定義標籤和過濾器
一、在settings中的INSTALLED_APPS配置當前app,否則django沒法找到自定義的simple_tag.
二、在app中建立templatetags模塊(模塊名只能是templatetags)
三、建立任意 .py 文件,如:my_tags.py
from
django
import
template
from
django.utils.safestring
import
mark_safe
register
=
template.Library()
#register的名字是固定的,不可改變
@register
.
filter
def
filter_multi(v1,v2):
return
v1
*
v2
<br>
@register
.simple_tag
def
simple_tag_multi(v1,v2):
return
v1
*
v2
<br>
@register
.simple_tag
def
my_input(
id
,arg):
result
=
"<input type='text' id='%s' class='%s' />"
%
(
id
,arg,)
return
mark_safe(result)
四、在使用自定義simple_tag和filter的html文件中導入以前建立的 my_tags.py ****
{
%
load my_tags
%
}
五、使用simple_tag和filter(如何調用)
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
.html
{
%
load xxx
%
}
# num=12
{{ num|filter_multi:
2
}}
#24
{{ num|filter_multi:
"[22,333,4444]"
}}
{
%
simple_tag_multi
2
5
%
} 參數不限,但不能放在
if
for
語句中
{
%
simple_tag_multi num
5
%
}
注意:filter能夠用在if等語句後,simple_tag不能夠
{% if num|filter_multi:30 > 100 %} {{ num|filter_multi:30 }} {% endif %}
simple_fileter (不經常使用)
最多兩個參數,能夠作條件判斷
方式 {{第一個參數|函數名稱:"第二個參數"}}
simple_tag
能夠在函數內部作判斷
參數個數無限制
使用方式 {% 函數名 參數 參數%}
六 模版導入入和繼承 (extend)
Django模版引擎中最強大也是最複雜的部分就是模版繼承了。模版繼承可讓您建立一個基本的「骨架」模版,它包含您站點中的所有元素,而且能夠定義可以被子模版覆蓋的 blocks 。
經過從下面這個例子開始,能夠容易的理解模版繼承:
模版導入:
語法:{% include '模版名稱' %}
如:{% include 'adv.html' %}

<div class="adv"> <div class="panel panel-default"> <div class="panel-heading"> <h3 class="panel-title">Panel title</h3> </div> <div class="panel-body"> Panel content </div> </div> <div class="panel panel-danger"> <div class="panel-heading"> <h3 class="panel-title">Panel title</h3> </div> <div class="panel-body"> Panel content </div> </div> <div class="panel panel-warning"> <div class="panel-heading"> <h3 class="panel-title">Panel title</h3> </div> <div class="panel-body"> Panel content </div> </div> </div>

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="/static/bootstrap-3.3.7-dist/css/bootstrap.min.css"> {# <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">#} <style> * { margin: 0; padding: 0; } .header { height: 50px; width: 100%; background-color: #369; } </style> </head> <body> <div class="header"></div> <div class="container"> <div class="row"> <div class="col-md-3"> {% include 'adv.html' %} </div> <div class="col-md-9"> {% block conn %} <h1>你好</h1> {% endblock %} </div> </div> </div> </body> </html>

{% extends 'base.html' %}
{% block conn %}
{{ block.super }}
是啊
{% endblock conn%}
模版繼承
Django模版引擎中最強大也是最複雜的部分就是模版繼承了。模版繼承可讓您建立一個基本的「骨架」模版,它包含您站點中的所有元素,而且能夠定義可以被子模版覆蓋的 blocks 。
經過從下面這個例子開始,能夠容易的理解模版繼承:
<!DOCTYPE html> <html lang="en"> <head> <link rel="stylesheet" href="style.css"/> <title>{% block title %}My amazing site{% endblock %}</title> </head> <body> <div id="sidebar"> {% block sidebar %} <ul> <li><a href="/">Home</a></li> <li><a href="/blog/">Blog</a></li> </ul> {% endblock %} </div> <div id="content"> {% block content %}{% endblock %} </div> </body> </html>
這個模版,咱們把它叫做 base.html
, 它定義了一個能夠用於兩列排版頁面的簡單HTML骨架。「子模版」的工做是用它們的內容填充空的blocks。
在這個例子中, block
標籤訂義了三個能夠被子模版內容填充的block。 block
告訴模版引擎: 子模版可能會覆蓋掉模版中的這些位置。
子模版可能看起來是這樣的:
{% extends "base.html" %} {% block title %}My amazing blog{% endblock %} {% block content %} {% for entry in blog_entries %} <h2>{{ entry.title }}</h2> <p>{{ entry.body }}</p> {% endfor %} {% endblock %}
extends
標籤是這裏的關鍵。它告訴模版引擎,這個模版「繼承」了另外一個模版。當模版系統處理這個模版時,首先,它將定位父模版——在此例中,就是「base.html」。
那時,模版引擎將注意到 base.html
中的三個 block
標籤,並用子模版中的內容來替換這些block。根據 blog_entries
的值,輸出可能看起來是這樣的:
<!DOCTYPE html> <html lang="en"> <head> <link rel="stylesheet" href="style.css" /> <title>My amazing blog</title> </head> <body> <div id="sidebar"> <ul> <li><a href="/">Home</a></li> <li><a href="/blog/">Blog</a></li> </ul> </div> <div id="content"> <h2>Entry one</h2> <p>This is my first entry.</p> <h2>Entry two</h2> <p>This is my second entry.</p> </div> </body> </html>
請注意,子模版並無定義 sidebar
block,因此係統使用了父模版中的值。父模版的 {% block %}
標籤中的內容老是被用做備選內容(fallback)。
這種方式使代碼獲得最大程度的複用,而且使得添加內容到共享的內容區域更加簡單,例如,部分範圍內的導航。
這裏是使用繼承的一些提示:
-
若是你在模版中使用
{% 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
標籤。