javascript - 仅使用客户端技术重用 HTML 代码

Question

我的任务是仅使用 HTML、CSS 和 JavaScript 等客户端技术创建网站。我们不能使用任何服务器端技术，因为讲师懒得安装任何东西，并且不允许我们使用诸如 Heroku 之类的东西进行部署。有没有办法我可以做到这一点？特别是我想为导航和页脚创建部分，而不必将它们复制并粘贴到每个文件中。

Answer 1

我知道两种不同的方法：

1. 使用 Ajax

您可以使用 ajax 来执行此操作 - 可能在 JavaScript 库或框架的帮助下。

JQueryload可以做类似的事情$('#header').load('header-partial.html');

如果您正在使用大量视图等构建更复杂的东西......我会考虑使用 MV* javascript 框架，如 Backbone.js 或 AngularJS。

查看 GitHub 上的AngularJS 种子项目以获取示例

2.使用构建脚本

如果您的站点足够简单，您只想在每个页面上包含页眉和页脚，那么您应该考虑将其作为部署过程中的构建步骤。IE 在本地编译您的 html，并在每个 html 页面上使用页眉/页脚代码上传完整页面。

如果 js 被禁用，这种方法的好处是不会破坏您的网站。

例如，查看 html5boilerplate 的ant 构建脚本