網(wǎng)站首頁 編程語言 正文
前言
我們已經(jīng)配置完Django,今天就來學(xué)學(xué)靜態(tài)文件與模板的放置使用。
模板
在上一章節(jié)中我們的視圖函數(shù)test使用了HttpResponse返回一個字符串
作為我們第一個Django程序
但只有這些是遠(yuǎn)遠(yuǎn)不夠的,你說要是別人看自己的網(wǎng)頁就幾行文字在那里,既不美觀也無意義。
存放目錄
我們平時看到的網(wǎng)頁都是通過HTML向我們呈現(xiàn)的內(nèi)容的,Django也一樣。一個完整系統(tǒng)必須有著大量網(wǎng)頁用于實現(xiàn)不同的功能,而那些HTML文件也有一個專門存放的目錄叫templates模板。這個目錄一般在APP目錄下創(chuàng)建,每個APP均可創(chuàng)建一個templates用來存放HTML文件。當(dāng)我們調(diào)用HTML文件的時候,系統(tǒng)就會根據(jù)APP的注冊順序在每個APP下的templates找所需要的HTML文件。
模板調(diào)用
那么現(xiàn)在我們在APP文件下創(chuàng)建一個templates目錄。
并在該目錄下創(chuàng)建一個名為demo的HTML文件
?輸入些內(nèi)容后就在能在視圖函數(shù)調(diào)用這個模板了。
進入view.py文件定義一個函數(shù)以調(diào)用demo.html模板。
from django.shortcuts import render, HttpResponse # Create your views here. def test(request): return render(request, "demo.html")
注意:函數(shù)一定要加上 request參數(shù),在引用html模板時使用的render同樣需要加上request參數(shù)。
接下來在url.py文件中,確定好關(guān)系就OK了。(網(wǎng)頁路徑以hd/為例)
點擊運行后,輸入網(wǎng)址http://127.0.0.1:8000/hd/進入。
就能看到跟上圖類似的運行結(jié)果了。
模板語法
Django不是標(biāo)記語言,它能進行數(shù)據(jù)處理。渲染網(wǎng)頁前會先執(zhí)行Django語句,然后將得出的符合邏輯的能夠呈現(xiàn)給用戶看的結(jié)果替換掉對應(yīng)位置的Django語句。
數(shù)據(jù)傳遞
在制作網(wǎng)頁時,如果我們不能一下子知道元素的值,比如需要通過數(shù)據(jù)庫才能獲取數(shù)據(jù)操作等,那么我們就要在視圖函數(shù)中將需要的數(shù)據(jù)以字典的形式進行傳遞給HTML。值得高興的是,常用的數(shù)據(jù)類型都能傳遞。
傳遞方法:將變量以字典形式通過render函數(shù)進行傳遞,在HTML引用時,通過雙花括號+鍵名引用。
現(xiàn)在試試吧!??
在視圖函數(shù)編寫些函數(shù),然后傳遞過去
s = "這是一個字符串" d = {"這是一個": "字典"} return render(request, "demo.html", {"str": s, "dict": d})
?之后在對應(yīng)的HTML頁面引用它
<h3> {{ str }} {{dict}}</h3>
?最后點運行。
?
元素引用
Django同樣支持引用字典,列表,元組等數(shù)據(jù)類型里面的值,不一樣的是Django用.取代了[]。
比如想引用字典里面的值需要通過?{{字典名.鍵名}} 來引用值(注意,鍵名無需使用引號。),如果想引用列表則?{{列表名.索引值}}?亦或者 多維列表?{{列表名.索引1.索引2...}} 來引用。
view.py
def test(request): d = {"這是一個": "字典"} l1 = [1, 2, 3] l2 = [[1, 2], [3, 4]] return render(request, "demo.html", {"list1": l1, "dict": d, "list2": l2} )
demo.html
<body> <h1>快看調(diào)用成功了沒有?</h1> <h3> {{list1.0}}</h3> <h3> {{list2.0.1}}</h3> <!--注意鍵名無需帶引號--> <h3> {{dict.這是一個}}</h3> </body>
?結(jié)果?
?for語句
Django也支持循環(huán)語句,但在使用完循環(huán)后需要加結(jié)束語句。這些命令都在?{% 命令 %}尖括號百分號之間。{與%之間沒有空格
循環(huán)使用字典時,?如果你想獲取鍵(keys),值(values),鍵值對(items)后面都不需要添加括號。
先看字典
d = {"今天": "天氣", "真不錯": "對嗎?"} l1 = [1, 2, 3] return render(request, "demo.html", {"list1": l1, "dict": d} )
<h1>快看調(diào)用成功了沒有?</h1> <!--無需帶括號--> {% for k, v in dict.items %} <h4>{{k}} -- {{v}}</h4> {% endfor %}
?
?再看看列表,Django不支持range,所以只能迭代列表。
還是那串代碼
def test(request): d = {"今天": "天氣", "真不錯": "對嗎?"} l1 = [1, 2, 3, 4] return render(request, "demo.html", {"list1": l1, "dict": d} )
?只是改了HTML
<h1>快看調(diào)用成功了沒有?</h1>{% for i in list1 %} <h4>{{list1}}</h4> <h4>{{i}}</h4> <!--不能這樣輸出值--> <h4>{{list1.i}} 前面好像沒輸出</h4>{% endfor %}
循環(huán)最后要使用endfor結(jié)束。另外,似乎不能通過列表值來訪問列表元素,導(dǎo)致{{list1.i}}沒有值?
?if語句
Django同樣支持條件語句。
<!--list = [1,2,3,4]--> <!--list.1 = 2--> {% if list.1 == 0 %} <h1>11111111111111111</h1> {% elif list.1 == 1 %} <h1>2222222222222222222</h1> {% else %} <h1>333333333333333333333</h1> {% endif %}
?
靜態(tài)文件
為了能夠呈現(xiàn)更精美的內(nèi)容亦或者提高代碼編寫效率,我們往往會使用到一些靜態(tài)文件。
在開發(fā)過程中一般將圖片,插件,css,js等當(dāng)做靜態(tài)文件處理。
存放目錄
靜態(tài)文件那么重要當(dāng)然有他們各自的歸宿,它們都存放在static目錄下。同樣的static目錄也在APP下面創(chuàng)建,每個APP都可以有一個專門存放靜態(tài)文件的目錄static。我們最好也能在static下對不同類型的文件進行分類存放。如,圖片存放在img文件夾中,插件存放在plugins文件夾中,css文件存放在css文件夾,js存放在js文件夾。
文件調(diào)用
我以一張圖片為例,講解一下是如何調(diào)用它的。
我們先將圖片放入static的img文件夾內(nèi),
在demo.html模板中的body使用img元素即可調(diào)用圖片。一般的調(diào)用是這樣的
<img src="/static/img/1.jpg" alt="沒圖片的話點運行重啟項目試試">
如果沒有顯示圖片的話重新運行一下應(yīng)該就能加載了。
但是在Django中有專門調(diào)用靜態(tài)文件的語法,我們也建議使用Django專門調(diào)用靜態(tài)文件的方法。進入設(shè)置,滑到底部有這一個變量
這里就記錄了我們靜態(tài)文件的存放位置。使用Django語法,如果靜態(tài)文件改名了,或者移到其他位置,直接在這里修改一下就好了,就不用在html引用靜態(tài)文件的時候逐個逐個修改路徑了。
現(xiàn)在就來看一下它的使用方法。在html頂部輸入
{% load static %}
聲明導(dǎo)入靜態(tài)文件
?不知道為什么我第二行會有紅線,可能pycharm不知道這是一個Django語句,不管它,接著輸入img圖片的導(dǎo)入路徑
<img src="{% static 'img/1.jpg'%}" alt="沒圖片的話點運行重啟項目試試">
?點擊運行
進入網(wǎng)址http://127.0.0.1:8000/hd/?即可完成圖片調(diào)用
css,js等文件導(dǎo)入的方法都是一樣的,只要我們知道了Django導(dǎo)入靜態(tài)文件的語法,渲染精致的html頁面就不成問題啦!現(xiàn)在快去試試
總結(jié)
無論是 {{ 變量 }} 還是 {% 表達式 %} 都屬于Django語法的一部分,在render函數(shù)內(nèi)部會將HTML中的DJango語句處理完并替換成相應(yīng)的字符串后再將標(biāo)準(zhǔn)的HTML格式內(nèi)容發(fā)送給瀏覽器。
原文鏈接:https://blog.csdn.net/lishuaigell/article/details/122867403
相關(guān)推薦
- 2022-07-07 通過Golang編寫一個AES加密解密工具_Golang
- 2022-02-17 藍屏終止代碼:WHEA_UNCORRECTABLE_ERROR
- 2023-11-19 如何將電腦復(fù)制的內(nèi)容粘貼進MobaXterm?如何復(fù)制粘貼
- 2022-04-01 k8s記一次kubelet啟動后master無法獲取node信息
- 2022-12-07 【Chrome】瀏覽器控制臺設(shè)置成中文
- 2022-07-10 Linux安裝及管理程序
- 2022-07-07 redis遠(yuǎn)程連接不上的解決辦法_Redis
- 2022-08-14 Android?MonoRepo多倉和單倉的差別理論_Android
- 最近更新
-
- window11 系統(tǒng)安裝 yarn
- 超詳細(xì)win安裝深度學(xué)習(xí)環(huán)境2025年最新版(
- Linux 中運行的top命令 怎么退出?
- MySQL 中decimal 的用法? 存儲小
- get 、set 、toString 方法的使
- @Resource和 @Autowired注解
- Java基礎(chǔ)操作-- 運算符,流程控制 Flo
- 1. Int 和Integer 的區(qū)別,Jav
- spring @retryable不生效的一種
- Spring Security之認(rèn)證信息的處理
- Spring Security之認(rèn)證過濾器
- Spring Security概述快速入門
- Spring Security之配置體系
- 【SpringBoot】SpringCache
- Spring Security之基于方法配置權(quán)
- redisson分布式鎖中waittime的設(shè)
- maven:解決release錯誤:Artif
- restTemplate使用總結(jié)
- Spring Security之安全異常處理
- MybatisPlus優(yōu)雅實現(xiàn)加密?
- Spring ioc容器與Bean的生命周期。
- 【探索SpringCloud】服務(wù)發(fā)現(xiàn)-Nac
- Spring Security之基于HttpR
- Redis 底層數(shù)據(jù)結(jié)構(gòu)-簡單動態(tài)字符串(SD
- arthas操作spring被代理目標(biāo)對象命令
- Spring中的單例模式應(yīng)用詳解
- 聊聊消息隊列,發(fā)送消息的4種方式
- bootspring第三方資源配置管理
- GIT同步修改后的遠(yuǎn)程分支