我有2个HTML文件,假设a.html和b.html。在a.html中,我想包括b.html。

在JSF中,我可以这样做:

<ui:include src="b.xhtml" />

这意味着在.xhtml文件中,我可以包含b.xhtml。

我们如何在*.html文件中做到这一点?


当前回答

你试过iFrame注入吗?

它在文档中注入iFrame并删除自己(它应该在HTML DOM中)

<iframe src=“header.html” onload=“this.before((this.contentDocument.body||this.contentDocument).children[0]);this.remove()”></iframe>

问候

其他回答

要让解决方案工作,您需要包括文件csi.min.js,您可以在这里找到它。

根据GitHub上显示的例子,要使用这个库,你必须在你的页头中包含文件csi.js,然后你需要在容器元素上添加data-include属性,将其值设置为你想要包含的文件。

隐藏复制代码

<html>
  <head>
    <script src="csi.js"></script>
  </head>
  <body>
    <div data-include="Test.html"></div>
  </body>
</html>

... 希望能有所帮助。

插入指定文件的内容。

<!--#include virtual="filename.htm"-->

这是我的内联解决方案:

(() => { const includes = document.getElementsByTagName('include'); [] .forEach。调用(包含I => { let filePath = i.getAttribute('src'); fetch (filePath)。然后(file => { file.text()。然后(content => { i.insertAdjacentHTML(“afterend”、内容); i.remove (); }); }); }); }) (); FOO < p > < / p > <包括src = " a.html " >加载…< /包括> 酒吧< p > < / p > <包括src = " b.html " >加载…< /包括> < p > t < / p >

使用jquery你需要导入库

我建议您使用PHP

<?php
    echo"<html>   
          <body>";
?> 
<?php
    include "b.html";
?>
<?php
    echo" </body> 
        </html>";
?>

b.html

<div>hi this is ur file :3<div>

使用includeHTML(最小js-lib:约150行)

通过HTML标签加载HTML部件(纯js) 支持加载:异步/同步,任何深度递归包括

支持的协议:http://, https://,文件:/// 支持的浏览器:IE 9+, FF, Chrome(也可能是其他)

用法:

1.在HTML文件中插入includeHTML到头部部分(或在正文结束标记之前):

<script src="js/includeHTML.js"></script>

2.在任何地方使用includeHTML作为HTML标签:

<div data-src="header.html"></div>