Question

背景

我有一个css和一个js仅供Google地图模板标记使用，我将其包含在模板中。

Inside template tag google_map:
...
...
return render_to_string('google_map.html', context)

内部google_map.html我有必需的css和js：

<link rel="stylesheet" type="text/css" href="mystyle.css" />

我的问题是：

我有一个包含3个地图的页面，因此有3个调用模板标签。这意味着css和js在同一页面中包含3次。 [不应该发生]

现在，我不能在页面的标题中包含这些css和js，因为所有页面都没有这样的地图，所有这些页面都会成为负担。

我应该怎么做，以便如果一个页面有3个或更多的地图，那么即使这样，也只有一个包括css＆amp; js而不是重复？

Answer 1

我建议遵循Paul Irish为Markup-based unobtrusive comprehensive DOM-ready execution引入的模式。这种方法有许多附带好处，例如封装，命名空间等，但主要的好处是基于<body>上的id或类来有条件地执行JavaScript。

因此，在您的基本模板中，将您的<body>标记更改为以下内容：

<body class="{% block body_class %}{% endblock %}">

然后，对于需要地图的模板，请执行以下操作：

{% block body_class %}{% if block.super %}{{ block.super }} {% endif %}maps{% endblock %}

这看起来有点复杂，但它所做的只是从为该块设置的任何父模板的值继承。 if块用于有条件地包括多个类之间所需的空间。

最后，在您的JavaScript中，您只需为文章描述创建一个“地图”模块，并将所有特定于地图的JS放在那里。

Answer 2

您可以在扩展的基本模板的<head>部分中使用新的django块：

<head>
  /* ... other css/js calls */
  {% block googlemapassets %}{% endblock %}
</head>

然后在视图模板中（假设content是主内容块）：

{% block content %}
  {% google_map %}
{% endblock %}
{% block googlemapassets %}
  <link rel="stylesheet" type="text/css" href="mystyle.css" />
{% endblock %}

Django：如何处理特定于模板标签的css / js？

2 个答案: