javascript - 如何在没有 src 属性的情况下在 iframe 中设置 div？

Question

没有 src 属性的 iframe。我想在没有 src 的情况下在 iframe 中设置 div，但这对我来说似乎很难。我的html代码是

<div class="demo-wrapper">
  <iframe src="">
    <div>
      <p>Hello World</p>
      <p>Hello World</p>
      <p>Hello World</p>
      <p>Hello World</p>
      <p>Hello World</p>
      <p>Hello World</p>
      <p>Hello World</p>
      <p>Hello World</p>
      <p>Hello World</p>
    </div>
  </iframe>
</div>

Answer 1

可以使用 JavaScript 实现。检查以下示例。

var html = document.getElementById("iframeCont").innerHTML;
var iframe = document.getElementById("myiframe");
iframe.src = 'data:text/html;charset=utf-8,' + encodeURI(html);

<div class="demo-wrapper">
  <iframe id="myiframe" src="">
  </iframe>
  <div id="iframeCont" style="display: none">
    <p>Hello World</p>
    <p>Hello World</p>
    <p>Hello World</p>
    <p>Hello World</p>
    <p>Hello World</p>
    <p>Hello World</p>
    <p>Hello World</p>
    <p>Hello World</p>
    <p>Hello World</p>
  </div>
</div>