CODEWITHSUNDEEP
html
Imtiaz Ahamed
Imtiaz Ahamed

Reputation:

How to add 1 pure html in another html

I am having 1 pure html page for ex. sample.html. I need to include this html into another pure html for ex.Orginal.html.How to do this? I am having a header image in my sample.html.It should come at the top of the Orginal.html page.

Upvotes: 7

Views: 8801

Answers (5)

cllpse
cllpse

Reputation: 21727

You could use JavaScript to load some HTML from one document into another. This task is fairly simple using the jQuery toolkit:

$("The ID of a container (a div element for instance) in which you want to load
the contents of a HTML file").load("path to html file you want to load");



<div id="inserthere" />



$(function ()
{
    $("#inserthere").load("loadme.html"); // Load the contents of loadme.html
                                          // and stuff it in the div with the
                                          // ID of "inserthere"
});

Upvotes: 1

Fenton
Fenton

Reputation: 250902

Here is an example of how to do it in pure HTML with an iframe, which although strangely not mentioned in HTML 4 specification is supported by all major browsers (and is in the HTML 5 specification)

<body>
<h1>This is original page</h1>
<p>Some content on original page.</p>
<iframe src="sample.html" width="600" height="300"></iframe>
</body>

You can adjust the width and height and you can also remove the border if you want the page to be more seamless.

Be wary of JavaScript solutions to this problem, especially if you want to be viewed on mobile devices.

Additional note: Avoid frameset solutions also, as they aren't valid markup.

Upvotes: 3

Quentin
Quentin

Reputation: 943510

See Include One File In Another, which has a summary of the various techniques that are available (along with their pros and cons).

Upvotes: 1

Marc Novakowski
Marc Novakowski

Reputation: 45398

If you're using Apache web server, you could try using server side includes.

Upvotes: 5

Michał Chaniewski
Michał Chaniewski

Reputation: 4806

You can't do such things in pure HTML, unless you use frames or iframe element. But better merge them by hand...

Upvotes: 4

Related Questions