Include A Webpage Inside A Div
Solution 1:
Try using an <object>
element:
<divstyle="margin: 0 auto; width:100%; height:400px;"><objecttype="text/html"data="**URL to page**"style="width:100%; height:100%; margin:1%;"></object></div>
Solution 2:
Nope. You can't embed a complete HTML document inside another div element as this is a block level element and W3C has defined what could be included inside it.
But there is a workaround. Follow these steps:
- Get the document using ajax (jQuery rocks, use that)
- Extract the content of the
<body>
element and put it inside yourdiv
element - Get all links and script of
<head>
element and append them to the<head>
element of your existing pgae.
Solution 3:
you should use iframe. that's basically what iframes are for. if you stick with modern browsers in any case they don't have issues with iframes (not more than you'll have to face using div's instead)...
Solution 4:
You can use iframe or if you decide to use jQuery load function (http://api.jquery.com/load/) you need to avoid the cross script scripting problem - you need to create some sort of proxie take a look at this: WebBrowser Control: Disable Cross Site XSS Filtering or another way to process JS in full on HTML
Solution 5:
It should have been in the question itself, but the OP has clarified the reason he does not want to use an iframe
is because interframe communication is not allowed. Well, that’s nothing a proxy + postMessage can’t solve.
I believe there is simply no way to actually embed a full document within another one, retaining things like separation of styles and scripts and the like, without using frames in some sense.
Post a Comment for "Include A Webpage Inside A Div"