基本上有4种方法将HTML嵌入到网页中:

<iframe> An iframe's content lives entirely in a separate context than your page. While that's mostly a great feature and it's the most compatible among browser versions, it creates additional challenges (shrink wrapping the size of the frame to its content is tough, insanely frustrating to script into/out of, nearly impossible to style). AJAX. As the solutions shown here prove, you can use the XMLHttpRequest object to retrieve data and inject it to your page. It is not ideal because it depends on scripting techniques, thus making the execution slower and more complex, among other drawbacks. Hacks. Few mentioned in this question and not very reliable. HTML5 Web Components. HTML Imports, part of the Web Components, allows to bundle HTML documents in other HTML documents. That includes HTML, CSS, JavaScript or anything else an .html file can contain. This makes it a great solution with many interesting use cases: split an app into bundled components that you can distribute as building blocks, better manage dependencies to avoid redundancy, code organization, etc. Here is a trivial example:

<！—其他来源的资源必须启用cors。--> <link rel="import" href="http://example.com/elements.html">

本地兼容性仍然是一个问题，但您可以使用polyfill使其在当前的常绿浏览器中工作。

你可以在这里和这里了解更多。

不，没有等价物。<iframe>元素在HTML5中仍然有效。根据您需要的确切交互，可能会有不同的api。例如，postMessage方法允许你实现跨域javascript交互。但是如果你想要显示跨域的HTML内容(使用CSS样式并使用javascript进行交互)，iframe仍然是一个很好的方法。

object是HTML5中一个简单的替代方案:

<对象数据= " https://github.com/AbrarJahin/Asp.NetCore_3.1-PostGRE_Role-Claim_Management/ " 宽度= " 400 " 身高= " 300 " type = " text / html " > 替换内容 < /对象>

你也可以尝试embed:

<嵌入src = " https://github.com/AbrarJahin/Asp.NetCore_3.1-PostGRE_Role-Claim_Management/ " 宽度= 200 身高= 200 onerror="alert('URL无效!!');"/>

Re-

目前，StackOverflow已经关闭了对显示外部URL内容的支持，运行代码片段不显示任何内容。但对于您的网站，它将完美地工作。

你应该看看JSON-P -当我有这个问题时，这是一个完美的解决方案:

https://en.wikipedia.org/wiki/JSONP

您基本上定义了一个javascript文件来加载所有数据，另一个javascript文件处理并显示数据。这样就摆脱了iframes丑陋的滚动条。

这似乎也可以工作，尽管W3C指定它不是“用于外部(通常是非html)应用程序或交互式内容”。

<embed src="http://www.somesite.com" width=200 height=200 />

更多信息: http://www.w3.org/wiki/HTML/Elements/embed http://www.w3schools.com/tags/tag_embed.asp

我创建了一个节点模块来解决这个问题node-iframe-replacement。您提供父站点的源URL和CSS选择器注入您的内容，它将两者合并在一起。

对父站点的更改每5分钟被检测一次。

var iframeReplacement = require('node-iframe-replacement');

// add iframe replacement to express as middleware (adds res.merge method) 
app.use(iframeReplacement);

// create a regular express route 
app.get('/', function(req, res){

    // respond to this request with our fake-news content embedded within the BBC News home page 
    res.merge('fake-news', {
        // external url to fetch 
       sourceUrl: 'http://www.bbc.co.uk/news',
       // css selector to inject our content into 
       sourcePlaceholder: 'div[data-entityid="container-top-stories#1"]',
       // pass a function here to intercept the source html prior to merging 
       transform: null
    });
});

该源代码包含一个向BBC新闻主页注入内容的工作示例。