- 应用背景：
这里的静态文件主要介绍三种：css文件 js文件 图片文件
使用方法：
加载这三个文件的位置：是在父模板还是子模板呢？放在父模板里的
通畅加载这三个内容是在最顶部就开始加载的，放在父模板里，放在子模板有可能出现加载不出来的情况
方法：
在Jinja中加载静态文件非常简单，只需要通过url_for全局函数就可以实现。
{{ url_for('static',filename='js/index.js') }}
类似于这样的方式，从全局的角度调用url_for
css的加载：
<link rel="stylesheet" href="{{ url_for('static',filename='css/index.css') }}">
js的加载：
<script src="{{ url_for('static',filename='js/index.js') }}"></script>
img的加载：
<img src="{{ url_for('static',filename='images/index.jpeg') }}" alt="">
完整代码：
python文件：
from flask import Flask,render_template
app = Flask(__name__)
@app.route('/')
def staticFile():
return render_template('list.html')
if __name__ == '__main__':
app.run(debug=True)
HTML文件：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="{{ url_for('static',filename='css/index.css') }}">
<script src="{{ url_for('static',filename='js/index.js') }}"></script>
</head>
<body>
<img src="{{ url_for('static',filename='images/index.jpeg') }}" alt="">
</body>
</html>
此外，在工作路径，新建static文件夹，在static文件夹内新建css images js文件夹：在子文件夹内再新建相应的文件，通过在url_for函数内通过filename指定文件的路径。
js:
定义动作
alert('hello world');
css:
定义网页格式
body{
background:pink;
}
网页：
url_for函数默认会在项目根目录下的static文件夹中寻找about.css文件，如果找到了，会生成一个相对于项目根目录下的/static/about.css路径。当然我们也可以把静态文件不放在static文件夹中，此时就需要具体指定了
app = Flask(__name__,static_folder='C:\static')
扫一扫
1681
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
