如何使用jQuery/ JavaScript在HTML模板中分离页眉页脚和侧边栏



我有一个模板,它有一个页眉、页脚和侧边栏;我想将它们分成单独的文件并将它们包含在主模板中。以前我使用的是PHP,通过include()required()函数很容易做到这一点,但是由于我使用的是node.js而不是PHP,我不知道该怎么做。

<script>
 $(document).ready(function (e) {
$( "#header" ).load( "header.html" );
$( "#sidebar" ).load( "sidebar.html" );
$( "#footer" ).load( "footer.html" );
});
</script>

你可以使用 jquery 来实现这一点。

我想做类似的事情

<% include ../partials/head %> 

在您看来应该可以正常工作。您也可以查看此处以获取更多信息

您可以使用 W3schools 库轻松实现此目的。

更多信息在这里

在 HTML 中添加此脚本

<script src="https://www.w3schools.com/lib/w3.js"></script>

调用 w3.includeHTML(( 以包含 HTML:

<script>
w3.includeHTML();
</script>

完整示例

<!DOCTYPE html>
<html>
<script src="https://www.w3schools.com/lib/w3.js"></script>
<body>
<div w3-include-html="content.html"></div> 
<script>
w3.includeHTML();
</script>
</body>
</html>

最新更新