Python全棧 Web(Django框架、模板)

1.Django中的模板(Templates)

1.什麼是模板

模板就是要動態呈現給用戶的網頁

模板的本質就是網頁- 前後端,動靜結合的網頁

Django的模板引擎是由Django自己提供的,並不是Jinja2,

                所以Django的模板語法與Flask(Jinja2)的語法會有一些不同


2.模板的設置

在 settings.py 中 有一個 TEMPLATES 變量

1.BACKEND:指定使用的模板的引擎

2.DIRS :指定模板的存放目錄們

1.如果寫東西:則按照寫好的路徑去找模板

2.如果未寫東西:那麼Django會自動的到每個應用中所有一個叫templates的目錄來作爲模板的存放目錄

3.APP_DIRS : 是否自動搜索應用中的目錄

True:表示搜索應用中的 templates 的目錄


# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/1.11/howto/static-files/

# 靜態文件的訪問路徑
STATIC_URL = '/static/'
# 靜態文件的存儲路徑
STATICFILES_DIRS = (os.path.join(BASE_DIR, 'static'),)


1.通過 loader 對象獲取模板,再通過HttpResponse進行響應

from django.template import loader

def xxViews(request):

#1.通過 loader 加載模板

t = loader.get_template("模板名稱")

#2.將模板渲染成字符串

html = t.render()

#3.將字符串通過HttpResponse響應給客戶端

return HttpResponse(html)

2.使用 render 直接加載並響應模板

def xxViews(request):

return render(request,'模板的名稱')



# Create your views here.
def temp_views(request):
  #1.通過loader加載模板
  t=loader.get_template('01-temp.html')
  #2.將模板渲染成字符串
  html=t.render()
  #3.再通過HttpResponse將字符串響應給瀏覽器
  return HttpResponse(html)

# 使用render加載模板
def temp02_views(request):
  return render(request, '01-temp.html')


4.模板的語法

1.變量

1.作用:將後端的數據傳遞給模板進行顯示

2.在Django中允許作爲變量傳遞給模板的數據類型

字符串,整數,列表,元組,字典,函數,對象

3.變量的語法

變量們必須要封裝到字典中才能傳遞給模板

1.使用 loader 加載模板

dic = {

'變量名1':'值1',

'變量名2':'值2',

}


t = loader.get_template('xxx.html')

html = t.render(locals() 或 dic)

return HttpResponse(html)

2.使用 render 加載並返回模板

dic = {

'變量名1':'值1',

'變量名2':'值2',

}

return render(request,'xx.html',dic)

4.在模板中使用變量

{{變量名}}




# http://localhost:8000/03-var
def var_views(request):
  str = "模板中的變量-字符串"
  num = 3306
  tup = ('謝遜','韋一笑','殷素素','金花婆婆')
  list = ['孫悟空','豬八戒','沙和尚']
  dic = {
    'BJ':'北京',
    'SZ':'深圳',
    'SH':'上海',
  }
  say = sayHi()
  dog = Dog()


  return render(request,'03-var.html',locals())


<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>

  <!-- 取出每個變量進行顯示 -->
  <h3>str:{{ str }}</h3>
  <h3>num:{{ num }}</h3>
  <h3>tup:{{ tup }}</h3>
  <h3>tup[0]:{{ tup.0 }}</h3>
  <h3>list:{{ list }}</h3>
  <h3>list[1]:{{ list.1 }}</h3>
  <h3>dic:{{ dic }}</h3>
  <h3>dic['SZ']:{{ dic.SZ }}</h3>
  <h3>say:{{ say }}</h3>
  <h3>dog.name:{{ dog.name }}</h3>
  <h3>dog.eat:{{ dog.eat }}</h3>

  <!-- 寵物名稱:{{ dog.name }} -->
  {% comment "寵物名稱" %}
  寵物名稱:{{ dog.name }}
  {% endcomment %}
</body>
</html>

django中不同於jinja2的模板 django的模板中不能使用索引和切片

只能通過·的方式來獲取元素 但不影響循環

2.標籤

1.作用

將服務器端的功能嵌入到模板中

2.語法

{% 標籤內容 %}

3.常用標籤

1. comment 標籤

2. for 標籤

作用:循環遍歷 列表,字典,元組

語法:

{% for 變量 in 列表|元組|字典 %}

{% endfor %}


循環中允許使用 forloop 內置變量來獲取循環的信息

forloop.counter : 當前循環遍歷的次數

forloop.first : 判斷是否爲第一次循環

forloop.last : 判斷是否爲最後一次循環


3.if 標籤

作用:在模板中完成變量的判斷操作

語法:

1. if

{% if 條件 %}

滿足條件時要執行的內容

{% endif %}

2. if ... else

{% if 條件 %}

滿足條件時要執行的內容

{% else %}

不滿足條件時要執行的內容

{% endif %}

3.if ... elif ... else

{% if 條件1 %}

滿足條件1時要執行的內容

{% elif 條件2 %}

或滿足條件2時要執行的內容

{% elif 條件3 %}

或滿足條件3時要執行的內容

{% else %}

或以上條件都不滿足時要執行的內容

{% endif %}



  <!-- 通過for循環便利tup -->
  <h1>使用for循環便利tup</h1>
  {% for t in tup %}
    <p
      {% if forloop.first %}
        style="background:red;"
      {% elif forloop.last %}
        style="background:blue;"
      {% else %}
        style="background:pink;"
      {% endif %}
    >
      <span>內容:{{ t }}</span>
      <br>
      <span>下標:{{ forloop.counter0 }}</span>
      <br>
      <span>次數:{{ forloop.counter }}</span>
      <br>
      <span>第一次循環:{{ forloop.first }}</span>
      <br>
      <span>最後一次循環:{{ forloop.last }}</span>
    </p>
  {% endfor %}

  <h1>通過for實現的select</h1>
  <select>
    {% for t in tup %}
      <option value="{{ forloop.counter0 }}"
       {% if forloop.last %}
         selected
       {% endif %}
      >{{ t }}</option>
    {% endfor %}
  </select>



3.過濾器

1.什麼是過濾器

在變量輸出顯示之前,對變量進行篩選和過濾

2.過濾器的語法

{{變量|過濾器:參數}}


3.常用過濾器

1.{{value|upper}}

將value變爲大寫

2.{{value|lower}}

將value變爲小寫

3.{{value|add:num}}

將num值累加到value之後

4.{{value|floatformat:n}}

將value四捨五入到n位小數

5.{{value|truncatechars:n}}

將value截取保留至n位字符(包含...)


4.靜態文件

1.什麼是靜態文件

在Django中,不被解釋器所動態解析的文件就是靜態文件

2.Django中靜態文件的處理

在settings.py中設置有關靜態文件的信息:

1.設置靜態文件的訪問路徑

在瀏覽器中通過哪個地址能夠找到靜態文件

STATIC_URL = '/static/'

如果訪問路徑是 http://localhost:8000/static/...,那麼就到靜態文件存儲路徑中找文件而不走路由(urls.py)

2.設置靜態文件的存儲路徑

指定靜態文件存儲在服務器上的哪個位置處

STATICFILES_DIRS=(os.path.join(BASE_DIR,'static'),)

靜態文件目錄的存放位置:

1.在項目的根目錄處創建一個 static 目錄,用於保存靜態文件們

2.每個應用中也可以創建一個 static 目錄,用於保存靜態文件們

3.訪問靜態文件

1.直接使用靜態文件訪問路徑進行訪問

http://localhost:8000/static/..

ex:

<img src="/static/images/a.jpg">

<img src="http://localhost:8000/static/images/a.jpg">

2.使用 {% static %} 訪問靜態資源

{% static %} 表示的就是靜態資源的訪問路徑

1.在模板的最頂層增加

{% load static %}

2.在使用靜態資源時

<img src="{% static 'images/a.jpg'%}">





# http://localhost:8000/04-static
def static_views(request):
  return render(request, '04-static.html')


{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
  <!-- 顯示靜態資源文件 -->
  <p>
    <img src="/static/images/shuaige.jpg">
  </p>
  <p>
    <img src="http://localhost:8000/static/images/shuaige.jpg">
  </p>
  <p>
    <img src="{% static 'images/shuaige.jpg' %}">
  </p>
</body>
</html>


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章