JavaScript function similar to PHP's include()?

[melting_dog]

Hi all,

 

I need to make a site that is entirely client side. I was wondering if any one new if there was a JavaScript equivilant of PHP's include()?

 

IE I want to include my header.html file at the top of every html page I make, rather then writing the same stuff again and again.

 

Any help would be great! Thanks!

[.josh]

you can make an ajax request, as long as the file is on the same domain as the page requesting it

[haku]

You can do it a few different ways, but the easiest way is to just write a new script tag to the head. In regular javascript, you can do something like this:

 

var scriptTag = document.createElement("script");
scriptTag.type = "text/javascript";
scriptTag.src = "path/to/script.js";
var headTag = document.getElementsByTagName("head")[0];
headTag.appendChild(scriptTag);

 

Personally, I prefer using jQuery, which has the getScript function which loads the script into memory (making it usable):

$.getScript("path/to/script.js");

[smoseley]

So you want to do Client-Side Includes?  I suggest you stick with SSI.  Diffferent UX.

[rythemton]

To include another JavaScript file, I've used something as simple as this:

document.write('<script type="text/javascript" src="' + PathToScript + '"></scr' + 'ipt>');

If you want to include HTML, AJAX is most likely what you'll need to use.

[Kays]

Although you probably shouldn't do that too much because all the loads may become annoying to some users, as well as possibly slowing down your site.

[haku]

On the contrary, loading scripts after page load, using javascript makes for a faster page load, not a slower one, as it allows the scripts to load asynchronously.

[smoseley]

On the contrary, loading scripts after page load, using javascript makes for a faster page load, not a slower one, as it allows the scripts to load asynchronously.

OP doesn't want to load JS asynchronously.... he wants to load the HEADER AND FOOTER asynchronously... e.g. the TEMPLATE.