Incluir otro archivo HTML en un archivo HTML

En mi opinión, la mejor solución utiliza jQuery:

a.html:

    <script src="jquery.js"></script> 
    <script> 
    $(function(){
      $("#includedContent").load("b.html"); 
    });
    </script> 



     <div id="includedContent"></div>

b.html:

<p>This is my include file</p>

Este método es una solución simple y limpia a mi problema.

La documentación de jQuery .load() está aquí.

Mi solución es similar a la de lolo arriba. Sin embargo, inserto el código HTML a través de JavaScript's document.write en lugar de utilizar jQuery:

a.html:

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

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

      ...

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

b.js:

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>\
\
');

La razón por la que me opongo a usar jQuery es que jQuery.js tiene un tamaño de ~90kb, y quiero mantener la cantidad de datos a cargar lo más pequeña posible.

Para obtener el archivo JavaScript correctamente escapado sin mucho trabajo, puede utilizar el siguiente comando sed:

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

O simplemente utilizar el siguiente script bash publicado como Gist en Github, que automatiza todo el trabajo necesario, convirtiendo b.html a b.js: https://gist.github.com/Tafkadasoh/334881e18cbb7fc2a5c033bfa03f6ee6

Créditos a Greg Minshall por el comando sed mejorado que también escapa las barras invertidas y las comillas simples, que mi comando sed original no consideraba.

Alternativamente, para los navegadores que soportan template literals lo siguiente también funciona:

b.js:

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>

`);

Como alternativa, si tiene acceso al archivo .htaccess de su servidor, puede añadir una simple directiva que permita interpretar php en los archivos que terminan en extensión .html.

RemoveHandler .html
AddType application/x-httpd-php .php .html

Ahora puede utilizar un simple script php para incluir otros archivos como:

<?php include('b.html'); ?>