模板Template
阿新 • • 發佈：2018-06-24
兩種 list 單獨 次循環 format utf 某個文件 -s edge 
模板語法:
在HTML中有兩種特殊的字符：{{ }}和 {% %}。
變量相關的用{{}}，邏輯相關的用{% %}
python的模板：HTML代碼＋模板語法
變量{{name}}
views
def template_test(request): l = [11, 22, 33] d = {"name": "alex"} return render(request, "template_test.html", {"l": l, "d": d}
HTML
<div>{{l.0}}</div> #11
<div>{{l.1}}</div> #22
過濾器Filters
語法： {{ value|filter_name:參數 }} ‘|‘左右沒有空格
1.返回長度 {{ content1|length }}
2.文件大小 <p>文件大小：{{ file_size|filesizeformat }}</p>
以kB MB的形式顯示 是 123456789，輸出將會是 117.7 MB
3.slice切片
<p>切片：{{ name_list|slice:"1:-1" }}</p>
<p>切片：{{ name_dict.name3|slice:"1:-1" }}</p>
4.date 格式化
<p>時間格式化：{{ now|date:"Y-m-d H:i:s" }}</p>
需要在views中引入時間模塊
from datetime import datetime
now = datetime.now()
5.safe
Django的模板中會對HTML標簽和JS等語法標簽進行自動轉義。 1.鏈接：views中傳給頁面一個標簽 a_html = "<a href=‘http://www.sogo.com‘>我是後端傳過來的a標簽</a>" 在頁面接收：鏈接：{{ a.html }} 在頁面上不顯示這個鏈接 鏈接：<a href=‘http://www.sogo.com‘>我是後端傳過來的a標簽</a> 需要加上safe，來告訴網頁這是是安全的，才能顯示出來 鏈接：我是後端傳過來的a標簽 2.script script_html = "<script>for(var i=0;i<100;i++){alert(123);}</script>" {{ script_html|safe }} 會在一面上一直彈出確認框
6.truncatechars
截斷的字符串將以可翻譯的省略號序列("...")結尾
參數：截斷的字符數 {{ content1|truncatechars:3}}
標簽{% tag %}
1.在使用{% teg %}的時候，有開始就一定有結束
{% for i in name %}
{% endfor %} #兩者成對出現
{% if num %}
{% endif %}
{% for foo in content %}
{% if foo > 1 %}
{{ foo }}
{% endif %}
{% endfor %}
2.if標簽
if else
{% if name_list|length >= 3 %}
<p>需要打兩輛車</p>
{% else %}
<p>一輛足矣！</p>
{% endif %}
if elif else
{% if p3 %}
<p>p3:{{ p3 }}</p>
{% elif p2 %}
<p>p2:{{ p2 }}</p>
{% else %}
<p>什麽人都沒有！</p>
{% endif %}
3.for標簽
1. for遍歷
遍歷列表 <ul> {% for user in user_list %} <li>{{ user.name }}</li> {% endfor %} </ul> 遍歷字典 {% for key,val in dic.items %} <p>{{ key }}:{{ val }}</p> {% endfor %}
2.forloop
for循環可用的一些參數：
forloop.first 當前循環是不是第一次循環（布爾值）
forloop.last 當前循環是不是最後一次循環（布爾值）
forloop.counter 當前循環的索引值（從1開始）
forloop.counter0 當前循環的索引值（從0開始）
forloop.revcounter 當前循環的倒序索引值（從1開始）
forloop.revcounter0 當前循環的倒序索引值（從0開始）
forloop.parentloop 本層循環的外層循環
{% for key,val in dic.items %}
{% if forloop.first %}
<p>{{forloop.counter }}</p>
{% endif %}
{% endfor %}
<p>雙層循環</p>
{% for name in name_list2 %}
{% for name1 in name %}
{{ forloop.parentloop.counter }}
{{ forloop.counter }}
{{ name1 }}
{% endfor %}
{% endfor %}
<hr>
3.for empty 如果取得值不存在就執行empty語句
<ul> {% for user in user_list %} <li>{{ user.name }}</li> {% empty %} <li>空空如也</li> {% endfor %} </ul>
4.with標簽
使用一個簡單地名字緩存一個復雜的變量 <p>with語句</p> {{ name_list2.1.1 }} {% with name=name_list2.1.1 %} {{ name }} {% endwith %}
母版{% extends ‘xxx.html‘ %}
1. 母版和繼承
1. 為什麽要有模板和繼承：
把多個頁面公用的部分提取出來，放在一個母版裏面。
其他的頁面只需要繼承母版就可以了。
2. 具體使用的步驟：
1. 把公用的HTML部分提取出來，放到base.html文件中(母版名字自定義）
2. 在base.html中，通過定義block，把每個頁面不同的部分區分出來
3. 在具體的頁面中，先繼承母版(在空的文件中繼承）
4. 然後block名去指定替換母版中相應的位置
3. 使用母版和繼承的註意事項：
1. {% extends ‘base.html‘ %} --> 母版文件:base.html要加引號
2. {% extends ‘base.html‘ %}必須放在子頁面的第一行！！！
3. 可以在base.html中定義很多block，通常我們會額外定義page-css和page-js兩個塊
4. view.py相應的函數中返回的是對應的子頁面文件 不是不是不是 base.html
4.繼承母版後，所有要在頁面山上顯示的內容都要放到{% block book %}{% endblock %}中，在塊內容外的內容該不會顯示
我們通常會在母板中定義頁面專用的CSS塊和JS塊，方便子頁面替換。
<!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> #放置每個頁面的css代碼 {% block page-css %} {% endblock %} </head> <body> <h1>這是母板的標題</h1> {% block page-main %} {% endblock %} <h1>母板底部內容</h1> #放置每個頁面的js代碼 {% block page-js %} {% endblock %} </body> </html>View Code
組件 {% include ‘xx.html‘ %}
可以將常用的頁面內容如導航條，頁尾信息等組件保存在單獨的文件中，然後在需要使用的地方按如下語法導入即可。
{% include ‘navbar.html‘ %}
navbar.html放要顯示的內容，這個html文件是不完整的，沒有head，body部分，不能單獨使用
靜態文件相關
<link href="/static/bootstrap/css/bootstrap.min.css" rel="stylesheet"> <script src="/static/bootstrap/js/bootstrap.min.js"></script>
靜態文件操作，當配置文件中STATIC_URL = ‘/static/‘別名更改時，需要把項目中的靜態文件href="/static/都改變，比較麻煩
使用以下代碼，當別名改變也無影響
{% load static %}
<link href="{% static "bootstrap/css/bootstrap.min.css" %}" rel="stylesheet">
<script src="{% static "bootstrap/js/bootstrap.min.js" %}
某個文件多處被用到可以存為一個變量
{% load static %}
<img src="{% static "img/banner_8.jpg" %}" alt="">
<img src="{% static "img/banner_8.jpg" %}" alt="">
banner_8.jpg 這個文件常用到，為其設置別名img1，以後用時直接用img1
{% static "img/banner_8.jpg" as img1 %}
<img src="{{img1}}" %}" alt=""> #要使用變量符號
模板Template