将所有 Javascript 移动到 Django 中的单独文件答案

【问题标题】：Move all Javascript to a separate file in Django将所有 Javascript 移动到 Django 中的单独文件
【发布时间】：2015-06-24 10:12:42
【问题描述】：

我从 Django 开始并做一些事情。我想保持 html 文件干净，没有 <script> 块。是否有可能，即使我的 js 部分正在使用 {% url %} 块？

例子：

page.html

<div> 
<h1> My home url is: </h1>
<div id="js-tag" ></div>
</div>
<script>
$(function(){
  $('#js-tag').html("{% url 'home' %}")
});
</script>

我想要的是删除它并将其放在一个单独的 js 文件中，然后将其导入到 page.html

【问题讨论】：

【解决方案1】：

（几乎）使用 Django 一切皆有可能！ ;)

您只需将 JavaScript 代码放在一个单独的 HTML 文件中，然后将其包含在您的主模板中（此处为：page.html），如下所示：

{% include 'path/to/my/template_file/js_code.html' %}

【讨论】：

你是对的。无法使用模板标签（例如 {% url '...' %} 在 .js 文件中。
但是你的建议很棒，非常感谢！
@Leistungsabfall：您是否 100% 确定模板标签不能在 .js 文件中使用？我记得很清楚，我在视图中创建了 .txt 文件并在其中使用了模板标签。我不认为模板标签只能在 .html 文件中使用。
@cezar 要在文件中使用模板标签，它们必须由 Django 提供。也许有一些丑陋的解决方法迫使 Django 也提供 .js 文件而不是通常的静态文件，但恕我直言，这比上面发布的解决方案复杂得多。
@Leistungsabfall 是的，你是对的。我在写完评论后想到了这一点。通过 django 视图生成带有模板标签的 .js 文件不是问题。在使用该 .js 文件之后出现问题。

【解决方案2】：

您可能希望使用django-js-reverse 能够在 js 文件中使用命名的 URL 模式。您还可以使用staticfiles 应用程序在 Django 中管理您的静态资产。

这将允许您以这种方式包含您的 js 文件：

{% load static %}  {# Only load static once at the top of your file #}
<script src="{% static 'path/to/js/in/staticfiles.js' %}"></script>

并且在js文件中可以使用：

$('#js-tag').html(Urls.home());

【讨论】：