Html 在 div 中包含一个网页
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6608494/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Include a webpage inside a div
提问by Varun
I have to include a webpage inside my webpage's div. I want somehting like iframeto be done with DIV. Basically, I will be providing a URL to my div and it has to open it inside itself... Do we have something like this in modern HTML? I cannot use frames as some browsers have issues with frames.
我必须在我的网页的 div 中包含一个网页。我想iframe用DIV. 基本上，我将提供一个指向我的 div 的 URL，它必须在其内部打开它......现代 HTML 中有这样的东西吗？我无法使用框架，因为某些浏览器存在框架问题。
采纳答案by Saeed Neamati
Nope. You can't embed a complete HTML document inside another div element as this is a block level elementand W3C has defined what could be included inside it.
不。你不能在另一个 div 元素中嵌入一个完整的 HTML 文档，因为这是一个块级元素，W3C 已经定义了可以包含在其中的内容。
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 yourdivelement - Get all links and script of
<head>element and append them to the<head>element of your existing pgae.
- 使用 ajax 获取文档（jQuery 摇滚，使用它）
- 提取
<body>元素的内容并将其放入您的div元素中 - 获取
<head>元素的所有链接和脚本，并将它们附加到<head>现有 pgae的元素中。
回答by Jan
Try using an <object>element:
尝试使用<object>元素：
<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>
回答by Headshota
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)...
你应该使用 iframe。这基本上就是 iframe 的用途。如果您在任何情况下都坚持使用现代浏览器，它们就不会遇到 iframe 问题（不会比您使用 div 所面临的问题更严重）...
回答by kleinohad
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
您可以使用 iframe 或者如果您决定使用 jQuery 加载功能（http://api.jquery.com/load/），您需要避免跨脚本脚本问题 - 您需要创建某种代理看看这个: WebBrowser Control: Disable Cross Site XSS Filtering or another way to process JS in full on HTML
回答by Alan H.
It should have been in the question itself, but the OP has clarified the reason he does not want to use an iframeis because interframe communication is not allowed. Well, that's nothing a proxy + postMessagecan't solve.
它应该在问题本身中，但 OP 已经澄清了他不想使用 aniframe的原因是因为不允许帧间通信。嗯，没有什么是代理 + postMessage解决不了的。
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.
我相信根本没有办法将一个完整的文档嵌入到另一个文档中，保留样式和脚本的分离等内容，而在某种意义上不使用框架。
回答by Endophage
This is really an extension to Saeed's response. To get around cross site scripting issues, you will have to write a script on your own server that does a CURL call for the webpage to be embedded. Your javascript will then make a call to this script, passing the URL as a GET/POST parameter.
这实际上是对赛义德回应的延伸。要解决跨站点脚本问题，您必须在自己的服务器上编写一个脚本，该脚本为要嵌入的网页执行 CURL 调用。然后，您的 javascript 将调用此脚本，将 URL 作为 GET/POST 参数传递。
I agree with a lot of other people here that this is a case where you really should just use an iframe... I believe you can set the iframe with no src tag and manually put the content inside it. That would mean you don't need to take the steps Saeed suggested to break up the head and body. However you still need the script I described to get around cross site scripting.
我同意这里的很多其他人的看法，在这种情况下，您真的应该只使用 iframe ……我相信您可以设置不带 src 标签的 iframe 并手动将内容放入其中。这意味着你不需要采取赛义德建议的步骤来分解头部和身体。但是，您仍然需要我描述的脚本来绕过跨站点脚本。
