Django靜態檔案配置
阿新 • • 發佈：2021-11-11
前端檔案一共分為html，css，js，以及一些第三方庫檔案；html檔案放在了templates模板資料夾下，程式碼的解耦一般都會把css程式碼和js程式碼分別寫到css檔案和js檔案，這時候就涉及到html引入其他檔案的配置了！
第一步：建立一個資料夾，這個資料夾只存放css，js，以及其他第三方庫檔案；比如：建立一個名為statics的資料夾
第二步：在settings.py中進行配置
# 這個需要自己新增配置 STATICFILES_DIRS = [ os.path.join(BASE_DIR, "statics") ] """ BASE_DIR是Django自有的變數 statics是剛自己建立的資料夾 STATIC_URL = '/static/' ---這個是Django自帶的，令牌的意思，代指statics的路徑，比如訪問statics資料夾下的jQuery3.6.js檔案，瀏覽器只需輸入http://127.0.0.1:8000/static/jQuery3.6.js；html引入其他檔案也是由/static代替"""
第三步：html如何引入檔案
{#引入jQuery/css/js等檔案，前面加上/static即可，也就是令牌#} <script src="/static/jQuery3.6.js"></script> <link rel="stylesheet" href="/static/app01/css01.css"> <script src="/static/app01/js01.js"></script>
html程式碼
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> {#引入jQuery/css/js等檔案，前面加上/static即可，也就是令牌#} <script src="/static/jQuery3.6.js"></script> <link rel="stylesheet" href="/static/app01/css01.css"> </head> <body> <h4>當前時間：{{ ctime }}</h4> <script src="/static/app01/js01.js"></script> </body> </html>
css程式碼
h4 { cursor: pointer; }
js程式碼
$("h4").click(function () {
$(this).css("color", "red");
});
while True:
print('studying...')