Include another HTML file in a HTML file

dom, html, include, javascript

Solution

In my opinion the best solution uses jQuery:

`a.html`:

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

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

`b.html`:

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

This method is a simple and clean solution to my problem.

The jQuery `.load()` documentation is here.

Problem

I have 2 HTML files, suppose `a.html` and `b.html`. In `a.html` I want to include `b.html`. In JSF I can do it like that: ``` <ui:include src="b.xhtml" /> ``` It means that inside `a.xhtml` file, I can include `b.xhtml`. How can we do it in `*.html` file?

Original source

Related problems