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

在JSF中,我可以这样做:

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

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

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


当前回答

插入指定文件的内容。

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

其他回答

一个简单的服务器端包含指令,包括在同一文件夹中找到的另一个文件,如下所示:

<!--#include virtual="a.html" --> 

你也可以试试:

<!--#include file="a.html" -->

这对我很有帮助。为了将一个html代码块从b.html添加到a.html,这应该放在a.html的head标签中:

<script src="https://code.jquery.com/jquery-1.10.2.js"></script>

然后在body标签中,一个容器用一个唯一的id和一个javascript块来加载b.html到容器中,如下所示:

<div id="b-placeholder">

</div>

<script>
$(function(){
  $("#b-placeholder").load("b.html");
});
</script>

我的解决方案类似于上面的lolo。但是,我通过JavaScript的文档插入HTML代码。编写而不是使用jQuery:

a.html:

<html> 
  <body>
  <h1>Put your HTML content before insertion of b.js.</h1>
      ...

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

      ...

  <p>And whatever content you want afterwards.</p>
  </body>
</html>

研究:

document.write('\
\
    <h1>Add your HTML code here</h1>\
\
     <p>Notice however, that you have to escape LF's with a '\', just like\
        demonstrated in this code listing.\
    </p>\
\
');

我反对使用jQuery的原因是jQuery.js的大小约为90kb,我想保持加载的数据量尽可能小。

为了得到正确转义的JavaScript文件,你可以使用下面的sed命令:

sed 's/\\/\\\\/g;s/^.*$/&\\/g;s/'\''/\\'\''/g' b.html > escapedB.html

或者只是使用以下方便的bash脚本作为Github上的Gist发布,它自动完成所有必要的工作,将b.html转换为b.js: https://gist.github.com/Tafkadasoh/334881e18cbb7fc2a5c033bfa03f6ee6

感谢Greg Minshall改进的sed命令,它还转义了反斜杠和单引号,这是我最初的sed命令没有考虑到的。

另外,对于支持模板字面量的浏览器,以下方法也适用:

研究:

document.write(`

    <h1>Add your HTML code here</h1>

     <p>Notice, you do not have to escape LF's with a '\',
        like demonstrated in the above code listing.
    </p>

`);

插入指定文件的内容。

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

一个非常老的解决方案满足了我当时的需求,但下面是如何做到标准兼容的代码:

<!--[if IE]>
<object classid="clsid:25336920-03F9-11CF-8FD0-00AA00686F13" data="some.html">
<p>backup content</p>
</object>
<![endif]-->

<!--[if !IE]> <-->
<object type="text/html" data="some.html">
<p>backup content</p>
</object>
<!--> <![endif]-->