Simple client side include

For a small test i’m working on I use the following function to load several sections in index.html (html5):

$(function(){
	$("#include-header").load("header.html");
	$("#include-footer").load("footer.html");	 
});

But noting gets loaded. Both header.html and footer.html exists, and are in the same location as index.html and I have jQuery included as well. What can be the reason they are not loaded?

Hey donboe,

Do elements with the specified ids exist on the page?
What does the network tab of your browser tools say? Is the request being fired off?
Are there any errors in the terminal?

Hi Pullo. Everything well I hope?

Yes the elements exist with the right id’s

Mmmmm This is what I get in the terminal

So I know the reason now!

Just install a HTTP server and all should work as desired.

This is the one I use: https://www.npmjs.com/package/http-server

Start it in the same directory as the file you want to serve, then navigate to http://127.0.0.1:8080/

1 Like

:+1: Thanks a lot @James_Hibbard

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.