如何在 javascript 的 iframe 中创建和执行代码

Question

我正在做一个网络编辑器，带有一个接收用户代码的文本区域和一个实时显示 html 的 iframe。 我有一个监听 keyup 用户的事件，这是我用来在 iframe 上执行 javascript 的代码

var iframe = $("#iframeresults").contents()  
$("#wrapper").on("paste keyup", function(){ 

  setTimeout(function(){ 

    iframe.find("body").html(webEditor.getHtml()); 
    iframe.find("style").html(webEditor.getCss()); 

    iframe.find("script").remove() 
    var script = document.createElement("script") 
    script.text = webEditor.getJS() 
    iframe.find("head")[0].appendChild(script) 

  },800) 

}); 

这很好用，但每次用户按键时我都必须删除并创建脚本标签，我的问题是，有没有另一种方法可以在不接触 dom 的情况下做到这一点？

我试过这个link

但如果我使用 eval 并且代码包含 sintax 错误，则停止

Answer 1

您始终可以在 iframe 的导入页面中预先存在脚本标签（带有一个空的“src”属性），然后在您通常插入整个节点时增加标签。从技术上讲，您仍在更改 dom，但是由于标签本身从页面诞生的那一刻起就存在于那里，因此您应该以这种方式轻松避免您试图避免的所有混乱。