可能的:插入我自己的HTML(整个网站)到一个iframe

Possible: Insert my own HTML(whole website) into an iframe

本文关键字：网站 iframe 一个 我自己 插入 自己的 HTML      更新时间：2023-09-26

我有一个网站的HTML存储在一个javascript字符串&我想把它放在一个框架中。如何将HTML字符串放入iframe &让它显示网站?我试过了。src = HTML_STR;这一点。innerHTML = HTML_STR;但是他们没有显示HTML_STR.

我明白这可能很愚蠢，因为我可以将iframes src设置为website &这样展示网站

但是我这样做的原因是因为它是一个网站更新程序。所以我想得到的网站(我正在更新)HTML，转换所有的元素与类"updatable"文本区域(所以他们可以更新)，然后显示在iframe的HTML。

使用iframe &不仅仅是在div中丢弃HTML，因为每个网站都导入一个。css样式表&我不希望他们的css文件影响我的更新网站css或有我的更新。css影响网站的HTML外观，因此，如果我在一个iframe显示网站每个网站的css不会影响对方。

例如，如果update .css有以下内容，它将影响其他网站的所有p元素html: 

p { background-color: red; width: 50%; }

所以有一种方法来插入我自己的HTML到iframe。或者有没有别的方法可以达到我想要做的。

假设您想从父元素写入iframe，您可以这样做:

var ifrm = document.getElementById('myFrame');
ifrm = (ifrm.contentWindow) ? ifrm.contentWindow : (ifrm.contentDocument.document) ? ifrm.contentDocument.document : ifrm.contentDocument;
ifrm.document.open();
ifrm.document.write('Hello World!');
ifrm.document.close();

这是一个工作的jsFiddle。原始代码取自此处和此处

你可以尝试在iframe内做document.write(yourHTMLString);。

另一种方法是，当单击某个按钮时，您可以使用JavaScript将原始HTML中的可更新元素替换为文本区域。

相关文章：