有没有办法将 HTML 导入 HTML 文件？

Question

我试过在这里和谷歌上寻找这个，但我还没有真正找到这个特定问题的答案，我不确定是否有什么 - 一个术语或我需要寻找的东西，所以我很抱歉如果这是一个常见的问题。

无论哪种方式，假设我正在构建一个包含许多部分的网站并且我希望这些部分是模块化的，所以每个部分都是它自己的 html 文件。所以基本上我可以在主 html 文件的任何地方包含这个小模块，或者我可以简单地将导航栏和页脚包含在其他 HTML 页面上而无需重写代码行。

这可能仅使用 HTML 吗？

原文由 jollyjwhiskers 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

编辑： 值得探索的选项是 object 标签。您可以在您的页面上包含另一个文件（任何类型）。

与下面的其他选项相比，这似乎是一个更合适的选项。

<object type="text/html" data="file.html"></object>

它的工作原理与 HTML5 导入类似。

object 标签是 HTML 4 的一部分，因此 IE6+、Firefox 2+、Chrome 1+ 等都 支持 它。

---

使用 HTML5 导入。它确实有 非常有限的支持/浏览器实现它。

<link href="extern.html" rel="import" />

除此之外，如果您想从客户端导入另一个文件，您至少需要 Javascript。根据您的技术，有多种选项可用于从后端执行此操作。

Pete 强调的另一种可能性是使用 iframe （尽管我不希望使用它们）。

---

正如您在 此处 所见，强烈建议不要使用 HTML5 导入。

以下是从上述链接中提取的一些注释：

• MS Edge 状态：考虑中

• Chrome 状态：已弃用

• Firefox 状态：未计划

• WebKit 状态：不考虑

• Firefox 没有计划支持 HTML 导入，但目前可以通过 about:config 中的“dom.webcomponents.enabled”首选项启用它

原文由 Adrian 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

不，这不能用纯 HTML 来完成。

备择方案：

• 运行服务器端代码，如 PHP
• 使用静态网站生成器来构建您的页面
• 在页面上使用 javascript 来引入通用组件（尽管当您试图消除页面之间的代码重复时这效果不佳）

原文由 Jonathon Reinhart 发布，翻译遵循 CC BY-SA 4.0 许可协议