flask中调用静态文件步骤

最新推荐文章于 2024-07-14 23:32:41 发布

原创最新推荐文章于 2024-07-14 23:32:41 发布 · 684 阅读

0 ·

CC 4.0 BY-SA版权

python 专栏收录该内容

8 篇文章

订阅专栏

本文介绍如何使用Flask框架快速搭建一个包含静态资源和模板的简易Web应用，包括创建主程序、设置路由、引入JavaScript文件及实现按钮点击事件。

1. test_flask.py主程序

from flask import Flask, render_template
app = Flask(__name__)

@app.route('/')
def index():
    return render_template('index.html')

if __name__ == '__main__':
    app.run(debug=True)

2. 在test_flask.py同目录下新建static目录，在static目录下新建js目录，在js目录下新建hello.js

function sayHello() {
    alert("Hello World!")
}

3. 在test_flask.py同目录下新建templates目录，在目录下新建index.html

<html>

   <head>
      <script type = "text/javascript"
         src = "{{ url_for('static', filename = 'js/hello.js') }}" ></script>
   </head>
    <body>
        <input type="button" onclick="sayHello()" value="Say Hello">
    </body>
</html>

4. 运行test_flask.py程序