Django - javascript 不会在 html 页面上加载答案

【问题标题】：Django - javascript doesn't load on html pageDjango - javascript 不会在 html 页面上加载
【发布时间】：2017-04-07 16:56:32
【问题描述】：

我的 Django 网站不会加载 javascript 文件，但它对于 css 部分来说很好，即使两者都在同一个静态文件夹中。

base.html:

<head>
    {% load static %}
    <meta charset="UTF-8">
    <link href="{% static 'login/css/bootstrap.css' %}" rel="stylesheet" type="text/css">
    <link href="{% static 'login/css/bootstrap.min.css' %}" rel="stylesheet" type="text/css">
    <link href="{% static 'login/css/bootstrap-theme.css' %}" rel="stylesheet" type="text/css">
    <link href="{% static 'login/css/bootstrap-theme.min.css' %}" rel="stylesheet" type="text/css">
    <script src="{% static 'login/js/bootstrap.js' %}"></script>
    <script src="{% static 'login/js/bootstrap.min.js' %}"></script>

    <title>LOGIN</title>
</head>

settings.py：

STATIC_URL = '/static/'
STATICFILES_DIRS = [
    os.path.join(BASE_DIR, "static"),
    ]

这里是静态文件夹的路径：

/home/nikola/Desktop/GIA/static

我搜索了谷歌，解决方案非常通用，例如 urls.py 或 python manage.py collectstatic（仅用于部署），并且没有帮助。我一无所知。

似乎是什么问题？

【问题讨论】：

为什么要同时加载 bootstrap.js 和 bootstrap.min.js？ min.js 是缩小版，你应该使用它。对于 css 文件也是如此。只需加载 min.css 版本。另外，如果您检查页面是否有错误，浏览器是否会标记任何错误？
这并不能真正解决问题，但感谢您的提示。
好的，我现在就回答你的问题:)
对不起，我没有注意到。有一个错误是： Uncaught TypeError: Cannot read property 'style' of null 127.0.0.1/:37 at initHeader (127.0.0.1/:37) at 127.0.0.1/:27 at 127.0.0.1/:206

标签： javascript python css django static

【解决方案1】：

正在加载 js 文件。我认为您只是没有看到 js 插件正常工作，因为您没有在 head 块中加载 jquery 文件。毕竟，引导 js 插件依赖于 jquery 才能工作。

此外，在大多数实践中，js 文件应该在 HTML 文件的末尾加载，在结束 </body> 标记之前，因为它们往往很大，您希望浏览器在 js 之前先加载较小的资源文件被加载。因此，您的结构应该类似于：

<html>
    <head>
        <!-- meta stuff here -->
        <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.4.min.js"></script> <!-- jquery should always load before any other scripts -->
        <link href="css1.css" rel="stylesheet">
        <link href="css2.css" rel="stylesheet">
        ...
        ...
    </head>
    <body>
        ...
        ...
        <script type="text/javascript" src="{% static 'login/js/bootstrap.min.js' %}"></script>
    </body>
</html>

【讨论】：

它不能解决问题。我测试了 jquery 并且它似乎已加载，但其他 js 仍然无法正常工作，即使我尝试加载的其他自定义 js 文件似乎仍然无法正常工作。顺便说一句，当我运行服务器时，我得到 ""GET /static/login/css/anim.css HTTP/1.1" 304 0" 这是自定义 js 文件。
anim.css是js文件吗？不应该是css文件吗？

【解决方案2】：

确保在 settings.py 中 DEBUG = True
在每个应用程序中保留静态文件夹，开发时，Django会在每个应用程序下搜索静态文件。仅发布到生产环境，使用 python manage.py collectstatic 的静态文件夹将在 Web 服务器配置中进行配置。如果你使用的是 nginx，etc/nginx/sites-enabled/config_file:
```
root  /.project_home/django_root;

location  /static/ {
           alias  /.project_home/django_root/static/;
}
```

【讨论】：