Geek Answers Handbook

Include webpage in div

I need to include a webpage in my div. I want to do something like an iframe using a DIV . Basically, I will provide the URL to my div, and it should open it inside myself ... Do we have something similar in modern HTML? I cannot use frames, as some browsers have problems with frames.

+8
html iframe
source share
7 answers

Nope. You cannot embed a full HTML document inside another div element, since it is a block level element, and the W3C has determined what can be included inside it.

But there is a workaround. Follow these steps:

  • Get the document using ajax (jQuery rocks, use this)
  • Extract the contents of the <body> element and put it in your div element
  • Get all the links and script of the <head> element and add them to the <head> element of the existing pgae.
+4
source share

Try using the <object> element:

 <div style="margin: 0 auto; width:100%; height:400px;"> <object type="text/html" data="**URL to page**" style="width:100%; height:100%; margin:1%;"> </object> </div>
+17
source share

you should use iframe. which is mainly for which frames. if you stick with modern browsers, in any case they have no problems with iframes (no more than you have to deal with using a div instead) ...

+2
source share

You can use iframe, or if you decide to use the jQuery download function ( http://api.jquery.com/load/ ), you need to avoid cross scripting scripting problem - you need to create some kind of proxy, look at this: Management WebBrowser: turn off XSS Cross Site filtering or another way to fully handle JS HTML

+1
source share

It should have been in the question itself, but the OP clarified the reason why he did not want to use iframe because interframe communication is not allowed. Well, this is not a proxy + postMessage can not solve.

I believe that it is simply impossible to embed a full-fledged document in another, while preserving things such as separating styles and scripts, etc., without using frames in a sense.

0
source share

This is truly an extension of Saeed's answer. To work around cross-site scripting issues, you will have to write a script on your own server that makes a CURL call to embed the web page. Then your javascript will call this script, passing the URL as a GET / POST parameter.

I agree with a lot of other people here that this is the case when you really need to use an iframe ... I believe that you can install an iframe without the src tag and manually put the content in it. This would mean that you do not need to take the steps that Said suggested breaking the head and body. However, you still need the script that I described to get around the cross-site site scripts.

0
source share

I had something close that I was working on, and a simple "EMBED", and then using SRC to point to an HTML page was a simple fix ... I don’t know if this will solve all your problems, but in my case it’s it’s just necessary to have a localized file with the content that I wanted to display on several pages, just to update the embedded html, and not on every page it was good !!

see an example of www.EruptNetwork.com (recent members section) If you are still in this thread

0
source share

More articles:


All Articles