Question

我创建了一个小项目，可以使用eval()

在文本区域内执行javascript。

HTML

<textarea id='js'><textarea>

<iframe id="inlineframe"></iframe>

JAVASCRIPT

(function(){
$('#js').on('keyup', runjs);
});

function runjs(){ document.getElementById('inlineframe').contentWindow.eval($('#js').val());
}

效果很好吗？但是，如果我不只是想要执行javascript怎么办？如果我希望它执行jquery怎么办？如何在功能中包含它？

Answer 1

HTML和JS中有一些错误。

没有结束的textarea标签，只有另一个textarea元素（忘记了/）
您已封装了一个匿名函数，但不要调用它（最后忘了（），所以它不是IIFE）

除此之外，还有一种将jQuery添加到iFrame的简单方法：通过将src属性添加到iFrame并将其指向另一个包含jQuery的html文件，就像当前的html文件一样。

如果您不想创建另一个文件，则可以通过JS这样添加jQuery文件：

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<textarea id="js"></textarea>
<iframe id="inlineframe"></iframe>
<script>
  function runjs() {
    document
      .getElementById("inlineframe")
      .contentWindow.eval($("#js").val());
  }
  (function() {
    $("#js").on("keyup", runjs);
  })();

  const iFrameHead = document.getElementById("inlineframe").contentDocument
    .head;
  const script = document.createElement("script");
  script.src =
    "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js";
  iFrameHead.appendChild(script);
</script>

从文本区域执行jQuery

1 个答案: