在初学者级别我正在尝试制作一个在所有页面上都有页眉和页脚的前端页面。每一页都可以有相同的页眉和页脚。在页眉中，我想添加一个Bootstrap导航栏(或类似的(，在页脚中，添加类似的东西。但是，与其只是将页眉和页脚复制到每一页，我更想将其作为一个单独的东西，并在加载时将其插入到每页中。这样，如果我更新页眉或页脚，它会在所有页面上更新。
过去，我用Python做过这件事，但我只在这个项目中使用前端，我只会在GitHub上发布(这主要是为了我自己的目的(。
如果这样做更容易的话，我将使用Visual Studio代码作为编辑器。
我也会有CSS和JS文件夹(如果这有什么不同的话(。
**更新编辑：
我试过这样做，但我错过了一些东西。
这就是我所尝试的(经过快速的谷歌搜索，现在我知道我在追求什么(：
<!--JQuery CDN-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<!--Include Content-->
<script>
$(function () {
var includes = $('[data-include]')
$.each(includes, function () {
var file = 'views/' + $(this).data('include') + '.html'
$(this).load(file)
})
})
</script>
</head>
<body>
<header>
<div data-include="header"></div>
</header>
我已经有一段时间没有这么做了，所以我已经生疏了，但出于某种奇怪的原因，这似乎不起作用。
有几种方法可以遵循，在初学者级别，您可以有一个内容是动态的方案，即页眉和页脚部分填充有变量或代码插入，在高级级别，有模板引擎，如果您想启动，php配置非常容易
我使用了W3方法：https://www.w3schools.com/HOWTO/howto_html_include.asp
到目前为止，它还不能同时处理页眉和页脚，只有页眉可以工作。我不确定为什么。将是下一个问题解决。