'How can I use jQuery in JS file? (feat.Flask)

app.py

from flask import Flask, render_template, request, jsonify

app = Flask(__name__)

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

if __name__ == '__main__':
    app.run('0.0.0.0', port=5000, debug=True)

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <link rel="stylesheet" href="static/index.css">

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

    <script src="scripts/jquery-1.10.2.js"></script>
    <script src="/jquery/index.js"></script>

    <title>Title</title>
    <script>

    </script>
</head>
<body>
    <h1>Hello World!</h1>
</body>
</html>

index.js

$(function () {
    $(document).ready(function () {
        alert('Hello World');
    });
}

I think I'm doing something wrong. I want to show a message when the document is ready. Even if I run app.py, the alert doesn't appear.

enter image description here



Solution 1:[1]

have you tried to embed the script directly inside the html code:

...
<script>your script code</script>
</body>
</html>

If that works, the relative path to src="/jquery/index.js" might be not correct.

Did you check logfiles from Apache (or whatever webserver you run) on errors related to index.js

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Markus Bo