将 html 源拆分为多个文件

新手上路,请多包涵

HTML 是否支持将源代码拆分为多个文件?我正在寻找 C++ 的一些等价物 #include ;或者可能类似于 C# 的 partial ;一个可以采用源路径并在该位置注入文件内容的元素。

如果之前有人问过这个问题,我们深表歉意。 Google 和 SO 搜索并没有返回多少。我不是网络专家,但我找到的唯一解决方案是使用 iframe ,许多人出于各种原因不喜欢它。

只是我的 html 源变得越来越大,我想通过拆分成多个文件来管理它。

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

阅读 838
2 个回答

如果您正在运行 PHP,这很容易实现:

PHP 语言内置了“include”命令。因此您可以使用“index.php”(注意您必须更改后缀,以便 PHP 解析器启动)并简单地使用以下语法。

 <html>
  <head>
    [...] (header content you want to set or use)
  </head>
  <body>
    <?php
      include "relative/path/to/your/firstfile.html";
      include "relative/path/to/your/secondfile.html";
      include "relative/path/to/your/evenwithothersuffix/thirdfile.php";
      include "relative/path/to/your/fourth/file/in/another/folder.html";
    ?>
    [...] (other source code you whish to use in the HTML body part)
  </body>
</html>

基本上使您的主要 index.php 文件成为容器文件,而包含的 html 文件成为您希望单独维护的组件。

为了进一步阅读,我推荐 PHP 手册W3Schools 包含 页面。

原文由 Julian 发布,翻译遵循 CC BY-SA 3.0 许可协议

你不能,至少不能在平面 HTML 中。您可以做的是使用 Javascript 加载和放置片段。 iframe s 也是不理想的,因为与 #includepartial 等指令发生的情况相反,片段永远不会被编译成单页

但是,我认为了解您的页面将如何提供服务在这里很重要。这是一个静态网站吗?因为在这种情况下,我会用您选择的语言编写一个简单的脚本来编译页面。假设您有这样的基础:

 <html>
    <head>
        <!-- ... -->
    </head>

    <body>
        {{ parts/navigation.html }}
        <!-- ... -->
    </body>
</html>

您可以编写一个脚本,逐行运行此文件并将内容加载到名为 compiled_html 的变量中。当它找到 {{ file }} 它打开 file ,读取其内容并将其附加到 compiled_html 。当它结束时,它将变量的内容写入 HTML 文件。您将如何实施它取决于您所知道的语言。我确信在 C# 中执行此操作非常简单。

通过这种方式,您将能够将 HTML 页面的源代码拆分为多个文件(并在需要时重复使用某些部分),但您最终仍会得到功能齐全的单个文件。

原文由 paratassi 发布,翻译遵循 CC BY-SA 3.0 许可协议

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题