Javascript 为什么我的iframe将html内容视为文本

为什么iframe将我的html内容视为文本内容

问题：我想用它的标签呈现整个html，而不是文本

下图显示了我的问题：

我的代码：

$'resultBtn'。关闭“单击”； $'resultBtn'。单击，函数{ var html='

单击我查看警报 var javascript=`document.querySelector'pclick'。在'click'上，函数{ 警惕“点击我”； }`; var bodyContent=html+`${javascript}`； $result_iframe.contents.findbody.html`${bodyContent}`； }; 结果帧{ 宽度：400px； 高度：200px； 背景：EAED； } 见结果

---

Semed，你的代码工作得很好。确保脚本是在jqueryinsert之后编写的

$('#resultBtn').off('click');
$('#resultBtn').on('click',function(){
  var html = '<p id="pclick">Click me to see Alert</p>'
  var javascript = `document.querySelector('#pclick').on('click',function(){
alert('clicked me');
})`;
  var bodyContent = html +`<script>${javascript}<\/script>`;


  $("#result_iframe").contents().find("body").html(`${bodyContent}`);
});

---

我不是专家，但我知道在阅读文档后，您无法通过文本传递JS。 在这里的编辑器中它不起作用，我不知道为什么，但在一个测试文件中它起作用了。 试试这个JSEN家长

  <button id="resultBtn">see Result</button>
   <iframe id="result_iframe" frameborder="0"></iframe>
   <script>
     var button = document.getElementById("resultBtn");
     var iframe = document.getElementById("result_iframe");

     button.onclick = function(){
       iframe.contentDocument.body.innerHTML = "<p onclick='window.parent.showAlert()'>Click Me</p>"
     }
     function showAlert(){
       alert("Hi");
     }
   </script>

---

此代码试图将HTML内容添加到iframe：

但是，不支持向iframe添加文本节点或HTML元素。从：

4.8.5 iframe元件

内容模型： 没什么

以下是在这种情况下的含义：

当元素的内容模型为nothing时，该元素必须不包含除元素间空白和元素节点之外的文本节点

---

鉴于不支持向iframe添加内容，使用不同的方法可能是个好主意。

您能在此处或此处为我提供一个片段吗jsfiddle@terrymorse，完整的html内容，如下所示，

单击我以查看警报

文档。querySelector'pclick'。单击时，函数{Alert'clicked me'；}iframe不是这样工作的。@terrymorse，那么stackoverflow、jsfiddle、codepen的代码片段是如何工作的，它与iframe一起工作的。我指的是这个网站来创建我自己的jsfiddle，它的演示在这里，我将在回答中提供参考。

$("#result_iframe").contents().find("body").html(`${bodyContent}`);