css/js的Django 'Include‘模板
css/js的Django 'Include‘模板
提问于 2017-08-07 07:00:54
我有一个通用模板，用于包含html (即。(menubar.html中的菜单栏)通过include标记进入其他应用程序模板。它具有一些已定义的css和js功能，存储在各自的menubar.css\menubar.js文件中。
在menubar.html文件中包含这些文件的链接似乎要方便得多，如下所示：
//At the Start
<link rel="stylesheet" href="{% static '<appname>/css/menubar.css' %}" />
//.... other menubar HTML
//At the End
<script src="{% static '<app_name>/js/menubar.js' %}"></script>我担心这不是一个好的实践，因为模板将加载css (不在HEAD中)和js (未位于BODY末尾)。它们被描述为标准HTML实践。
明确的替代方法是将css或js链接到包含子模板的每个模板中，但这似乎很乏味。
我知道扩展模板也是可能的，但是我相信css/js的使用也会出现同样的问题。
什么是最好的？
回答 2
Stack Overflow用户
回答已采纳
发布于 2017-08-07 07:41:52
您可以在这里使用django-sekizai包：
https://django-sekizai.readthedocs.io/en/latest/
您将有一个基本模板，如下所示：
{% load sekizai_tags %}
<!DOCTYPE html>
<html lang="en">
<head>
...
<!-- other css and head content goes here -->
{% render_block "css" %}
</head>
<body>
...
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
{% render_block "js" %}
</body>
</html>然后，在您的menubar.html中，您可以在模板中的任何地方添加以下内容，它们将被添加到页面头部，并将javascript添加到正文的底部：
{% addtoblock "css" %}
<link rel="stylesheet" href="{% static '<appname>/css/menubar.css' %}"/>
{% endaddtoblock %}
{% addtoblock "js" %}
<script src="{% static '<app_name>/js/menubar.js' %}"></script>
{% endaddtoblock %}这是一个非常方便的包裹！
Stack Overflow用户
发布于 2017-08-07 07:09:51
通过使用模板继承，您可以在django中动态加载js和css。这是参考。
在这上发布的关于javascript加载的文章中，继承标记的使用可能如下所示：
#base.html
{% block js %}
<script src="{% static '<app>/js/resource.js' %}"></script>
... //other scripts
{% endblock %}然后在另一个模板中：
# child.html
{% extends base.html %}
{% block js %}
{{ block.super }} //Includes base.html js block content
<script src="{% static '<otherapp>/js/resource2.js' %}">
... //other scripts
{% endblock%}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/45550036
复制
相似问题
include JS脚本中的Django模板替换
Django模板，'include‘css而不是使用链接
Django模板{% Include%}回退值
js：{% block include %}-style模板的模板引擎
Django模板-更改'include‘模板的上下文
添加站长 进交流群
领取专属 10元无门槛券
AI混元助手 在线答疑
关注 腾讯云开发者公众号
洞察 腾讯核心技术
剖析业界实践案例
💥开发者 MCP广场重磅上线！
精选全网热门MCP server，让你的AI更好用 🚀
腾讯云开发者
