在iframe中运行Javascript / jQuery

Question

我目前正在使用网络编辑器，您可以在其中输入HTML，CSS和JavaScript代码并实时查看结果。 与JSBin或JSFiddle类似。 （我这样做是为了获得离线编辑器）

我已经遇到了很多问题，尤其是在CSS方面，但是我通过使用iframe并将所有代码注入其中来解决了这些问题。 在您键入一些JavaScript之前，它的效果非常好。

我在<script></script>之间发送代码，但与CSS不同，它无法运行。 非常奇怪的是，当我输入$('button').css('color', 'red'); ，则编辑器的按钮实际上会受到影响，但iframe的按钮则不会受到影响。 恰恰与我的预期相反。 我已经尝试了很多事情，在论坛上看了很多话题，但是没有任何效果。 我还尝试在iframe中加载空白页。 在这种情况下，JavaScript可以运行，但是无法在iframe中编辑代码！ 这是怎么回事？ 我要去哪里错了？ 预先感谢您的帮助！

这是我的编辑器： https : //jsbin.com/tuqite/edit?html,js,output/

Answer 1

尝试像这样更新iframe的内容。

// this string contains both html and script
var html_string= "content";
document.getElementById('childFrame').src = "data:text/html;charset=utf-8," + escape(html_string);

通过像您所做的那样直接更新iframe DOM可能不是正确的方法。