Question

iFrame可以显示源的原始代码而不是将其呈现出来吗？如果是这样，你如何做到这一点，它可以在JavaScript上完成吗？

Answer 1

不直接，但没有理由不能用Javascript完成。进行AJAX调用以获取HTML源HTML-encode a few key characters，并将结果设置为框架或其他元素的内容。

Answer 2

您可以将src属性设置为Web服务器上的页面，该页面将html输出为纯文本而不是HTML。因此，您必须将标题信息content-type设置为text / plain。查看此页面，了解它是如何在PHP中完成的：http://www.jonasjohn.de/snippets/php/headers.htm

仅使用html或js无法做到这一点。您需要一些服务器端语言来呈现页面。当然，可以通过xmlhttprequest（更好地称为AJAX）从js中的web服务器检索数据。

Answer 3

您有两种主要方法：

如果要在后端执行此操作，则必须将响应的Content-Type标头修改为text/plain。这样，浏览器在加载页面时将不会呈现HTML代码。实现将取决于您的堆栈。
如果要在客户端使用Javascript进行操作，则可以从iframe元素中提取代码，如下所示：

<iframe id="myIframe" src="https://example.org"></iframe>

<script>
const iframeElement = document.getElementById('myIframe');
let rawHtml = null;

// We extract the code each time the iframe element is loaded
// If we try to do it before that moment, we won't get any HTML
iframeElement.addEventListener('load', function () {
  console.log('HTML loaded and available in rawHTML variable');
  rawHtml = iframeElement.contentDocument.documentElement.innerHTML;
});
</script>

此代码段不适用于JSFiddle！我敢打赌这是由于加载iframe时采取了安全措施。

有关iframe和iframe安全注意事项的更多信息：https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe

Answer 4

没有。您需要一个工具将HTML转换为要显示的文本。

iFrame只能显示源代码吗？

4 个答案: