Insert HTML from another file?

Question

I have a website, and I want to insert the HTML from another file into the web page each time the page loads.

for example, if I had a file called index.html, and another file called header.html, how can I have index.html insert the code from header.html each time the page is loaded?

I tried looking for a javascript function that can read and insert a file off the server, but I couldn't find anything.

Thanks for any help you can provide.

Answer 1

Because JavaScript runs on the client (the browser) and not the server, it doesn't have direct filesystem access to files on the server's hard disk.

However, if the file is on the SAME website, you can write something that will send a normal HTTP request to the server, read the file, and insert it in your page. This type of approach is referred to as Ajax [1], and is becoming quite popular on the web. Examples of sites that make use of Ajax are Flickr [2], the new Yahoo! Maps [3], and Digg.com [4].

Of course, if you are talking about simple HTML frames, that's a much easier problem. It looks like you have some promising Answers about how to do HTML frames.

I can't really explain all the details of writing the Ajax script here, because it's pretty involved. But I can certainly link to a few great articles on writing these kinds of JavaScript. It is an advanced use of JavaScript, but if you are patient and read the articles, you should be able to handle it. Good luck!

Here are some articles:

Background: http://en.wikipedia.org/wiki/AJAX

Quick and dirty: http://jibbering.com/2002/4/httprequest.html

Details:

http://www.adaptivepath.com/publications/essays/archives/000385.php
http://ajaxian.com/

Answer 2

It sounds like you are talking about frames. It is easy to do in Dreamweaver. In html you might want to look at someone else's site for the code.

This site is a frameset page called Index.htm which displays the topframednav.htm in the top frame and body.htm in the body.

http://www.mocroi.com

To get the frameset code, go to the link and then right away View Source (if you click on any other part of the doc, you will only get the Source for that htm page).

I hope this helps! Peace!

Answer 3

I do this all the time. I have a header and a footer file that loads every time a page loads. It's using the include option, which only works in ASP.

In HTML you can try using the iframe source

Answer 4

You use framesets. It would take me forever to teach it to you, so either go buy "HTML in 24 hours" or go to a website that only changes the one part when you click a link. View the source code and look for or look for all the height and width variables too.

Answer 5

go to view, then source while looking at file.

cut and paste the html code.

do this again with another file.

make one from the two.

insert it into your page.

sometimes it works perfectly. it should. i'm not very good, but i hope that helps.

Answer 6

Have a look at how the Google adsense ads are done.