Best IT Recipes

How to load a webpage into a div using Javascript without IFRAME and jQuery?

I need to load an external webpage into a div. I do not want to use iFrame. And I want this to be done using simple Javascript. I am not sure how to do this.

+1
javascript html css
Mar 04 '13 at 22:00
source share
4 answers

With difficulties...

Use Ajax (e.g. via XMLHttpRequest ) to get the page. Since it is external, you need to circumvent the same origin policy .

Once you have the page, extract the corresponding parts (possibly children of the body element) and add this to the existing DOM .

You will need to consider different stylesheets between your site and the external, for relative URIs (for resources on the external site that are not located on yours), and for any scripts in the remote content.

+3
Mar 04 '13 at 22:22
source share

You can load html pages per page using the jQuery.get () method. I use this method for two sites for my clients, where separate pages represent different sections of the site.

I'm not sure of the behavior you might encounter if you try to use this method to load full HTML pages containing header information and a body tag. I recommend using it to load HTML snippets.

jQuery.get ()

0
Mar 04 '13 at 22:21
source share

You don't even need javascript -

but the same restrictions apply as for iframes to include different domains.

 <!doctype html> <html lang="en"> <head> <meta charset= "utf-8"> <title>test page</title> </head> <body> <div> <object type="text/html" data="http://validator.w3.org/" width="800px" height="600px" style="overflow:auto;border:5px ridge blue"> </object></div> </div> </body> </html>
0
Mar 05 '13 at 0:55
source share

Whatever method you use, in js try this instead: $('#myid').load('mylink.com')

I only know this in js.

0
May 9 '14 at 18:18
source share


More articles:


All Articles