Django如何在子模板中动态添加js和CSS？

Question

我是 Django 新手。

我设置了一个基本模板，其中使用 base.html来包含位于顶部{% block body %}{% endblock %}的 index.html 和 test.html 子模板。{% extends 'base.html' %}

base.html 模板包含 Bootstrap。CSS 和 JS 都包含在其中。index.html 需要包含 select2 但 test.html 不需要。

我可以在这里使用块来解决我的问题（将 CSS 和 JS 块添加到 base.html），但我认为这很快就会变得非常混乱。

无论如何，我是否可以使用 Django 中的资产来创建 select2 资产，并在子模板中调用该资产以向父模板注册所需的 JS 和 CSS？

我所看到的只是压缩，到目前为止，大量搜索都一无所获。

Answer 1

可以在您的 中再添加 2 个块base.html：

<some css>
{% block additional_css %}
{% endblock additional_css %}

...

<some js>
{% block additional_js %}
{% endblock additional_js %}

并在从以下扩展的任何页面中覆盖它们base.html：

{% extends "base.html" %}

{% block additional_css %}
    <link rel="stylesheet" type="text/css" href="{% static 'css/bootstrap-datetimepicker.min.css' %}">
{% endblock additional_css %}

...

{% block additional_js %}
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.11.0/moment.min.js"></script>
    <script type="text/javascript" src="{% static 'js/bootstrap-datetimepicker.min.js' %}"></script>
{% endblock additional_js %}

这是一个很好的做法，因为在这种情况下，脚本将在最后加载，并且如果您添加的某些脚本需要例如 JQuery，您将不会遇到任何问题。

它不会使代码变得混乱，它是扁平且易于解释的。最好考虑如何不让 JS 变得混乱，正如你所指出的，有几种方法可以做到这一点，其中之一就是压缩所有 JS。