How to include html file to another html file using js?

Hello Friends…

Let me show you a code to how to include html file to another html file using js?

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script> 
    $(function(){
	   $("#header").load("header.html"); 
	    $("#footer").load("footer.html"); 
	  });
</script> 

HTML code as a below:

<html>
<body>
<div id="header"></div>
<div class="middle-content">
// content here
</div>
<div id="footer"></div>
</body>
<html>

Load method fetched the data form html file which you have mentioned in this function and will returned the HTML into the matched elements.
ex. header.html file data returned into this section (<div id=”header”> </div>)

I hope this article will helpful 🙂

Blog Catagory : jQuery