Question

我有一个Google地图“小部件”，其中包含html，css和javascript，它们需要在使用此地图的任何地方出现。因此，我正在寻找一种方法将这些组件提取到一个小部件，如文件，只需在我想使用地图的地方包含此文件。

我已经考虑过了：

使三个组件包含三个单独的文件。这是我目前的后备解决方案，因为我希望它只是一个文件。
在标题中包含css和javascript，然后使用javascript将所需的html添加到页面上存在的元素中。这似乎是一个黑客解决方案，它会在客户端完成，因为它会比html包含在服务器端更慢。
以及为此问题提出的解决方案： How to include plug-n-play widget statics [CSS/JS] without repetition?但就像提出这个问题的人一样，我想要一个更好的解决方案，而不仅仅是创建一个新的基本模板。

我之前的尝试包括在标题和所需位置创建包含必要代码和{％include“maps-widget.html”％}的html文件。在两次尝试中都声明小部件中包含的谷歌api不存在。

我正在运行python 2.7和Django 1.5.4。

Answer 1

您可以将HTML，CSS，JS放在项目的Base模板中，然后它将出现在您的所有页面中。这是Django Docs，展示了如何：

http://www.djangobook.com/en/2.0/chapter04.html

CSS / JS的典型实现如下所示：

<!-- Your base.html file -->

{% block static %}

  Your CSS Files go here

{% endblock static %}

{% block content %}

  This can be a default value, but otherwise your template will override it

{% endblock content %}

{% js block %}

  Your JS files / links

{% endblock js %}

现在只需扩展你的base.html模板，它将继承所有的CSS / JS文件

<!-- myTemplate.html -->

{% extends "base.html" %}

{% block content %}

  Your Google Map content, etc...

{% endblock content %}

在Django html模板中包含html，css，js小部件

1 个答案: