问询：Django项目前端资源加载错误及导航栏显示异常修复

一、解决「拒绝应用jQuery资源作为样式，MIME类型不匹配」问题 #

• 立刻检查HTML中jQuery的引入标签：绝对不能用<link>标签加载JS文件，必须用<script>标签。
  错误示例：

  <link rel="stylesheet" href="jquery.min.js">
  

  正确示例（需先在模板开头加{% load static %}）：

  <script src="{% static 'js/jquery.min.js' %}"></script>
  

• 确认Django静态资源配置：在settings.py中检查

  STATIC_URL = '/static/'
  STATICFILES_DIRS = [BASE_DIR / "static"]
  

二、修复「部分资源请求返回404」问题 #

• 所有静态资源（JS、CSS、图片）必须用Django的static模板标签生成路径，禁止写相对路径。
  错误示例：

  <script src="js/nav.js"></script>
  

  正确示例：

  <script src="{% static 'js/nav.js' %}"></script>
  

• 核对静态文件实际存放路径是否与STATICFILES_DIRS配置一致，比如static/js/下是否确实存在对应脚本文件。
• 开发环境可重启python manage.py runserver，生产环境需执行python manage.py collectstatic同步资源。

三、解决「拒绝执行本地脚本，MIME类型为text/html不可执行」问题 #

• 该错误本质是路径错误导致Django返回了404页面（HTML格式）而非目标JS文件，按照上述404问题的修复方法修正资源路径即可。
• 若使用第三方服务器（如Nginx），需确保配置了正确的MIME映射：

  types {
      application/javascript js;
  }
  

四、修复nav_list div未显示问题 #

• 检查导航模板的引入逻辑：主模板是否通过{% include 'nav.html' %}正确引入了导航组件，角色区分的导航（Admin/User）是否通过条件判断正确渲染，比如：

  {% if user.is_staff %}
      {% include 'navAdmin.html' %}
  {% else %}
      {% include 'navUser.html' %}
  {% endif %}
  

• 查看nav_list的CSS样式：在浏览器开发者工具的Elements面板检查该元素的计算样式，确认是否存在display: none或被其他样式覆盖的情况。
• 确认视图是否正确传递了用户身份等必要参数，确保模板中的渲染逻辑能正常触发。

内容的提问来源于stack exchange，提问作者B A N G A T A