【解決方法】base.html に materializecss、jquery、datatables を一度だけ含めるにはどうすればよいですか

[ad_1]

こんにちは、私は Django を使用して Web アプリケーションを設計しようとしています。このアプリケーションでは、Materializecss、jQuery (DatePicker および Select2)、および Datatables を使用する必要があります。私の課題は、必要な .css および .js ファイルを base.html に 1 回だけ含めて、これらのライブラリが他のページにもカスケードされるようにすることです。これらのファイルを正しく含めるためのヒントは、大いに役立ちます。ありがとう。

私が試したこと：

HTML

<!DOCTYPE html>
{% load static %}
<html>
<head>
    <!--Import Google Icon Font-->
    <link href="http://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
    <!--Import materialize.css-->
    <link href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.98.2/css/materialize.min.css"
          rel="stylesheet">
    <link href="https://code.jquery.com/ui/1.13.2/themes/base/jquery-ui.css" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css"
          rel="stylesheet"/>
    <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js" defer></script>
    <!--Let browser know website is optimized for mobile-->
    <meta content="width=device-width, initial-scale=1.0" name="viewport"/>
    <link href="{% static 'css/dashboard2.css' %}" rel="stylesheet">
    <title>Title</title>
</head>

<body>
{% include 'partials/sidenav.html' %}
{% include 'partials/navbar.html' %}
{% block content %}
{% endblock %}

<!--<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>-->
<script src="https://code.jquery.com/ui/1.13.2/jquery-ui.js"></script>
<script src="https://code.jquery.com/jquery-3.6.0.js"></script>
<script
    src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.98.2/js/materialize.min.js">
</script>
<script
    src="https://cdn.datatables.net/1.10.7/js/jquery.dataTables.min.js" type="text/javascript">
</script>
<script>
	// Code for SideNav
</script>

<script>
	// Code for DataTable
</script>
</body>
</html>

解決策 1

base.html がベース/マスターページとして機能している場合にのみ可能です。プレーンな html ではサポートされていませんが、多くの開発パッケージではサポートされています…
Django テンプレートのように…

ジャンゴ | MasterPages の作成と使用[^]

[ad_2]