javascript - 在 chrome 中使用 javascript 将 iFrame src 属性设置为编码数据 URI

Question

我正在尝试编写一个 iFrame 以充当 chrome 浏览器内 HTML/Javascript/CSS IDE 中的测试区域，但由于某些错误，我失去了很多功能，我想知道是否有人可以告诉我如何将 iFrame 的 .src 属性设置为 URL，其中包含直接在 .src 属性中编码的 html Javascript CSS 等代码。不要告诉我它不能完成，因为我知道它可以，我只是丢失了我找到这个方法的网页。另外，作为旁注，是否可以通过编程方式强制刷新此 iFrame？

谢谢你的时间，

克里斯

Answer 1

使用 srcdoc相反，您可以直接在其中修改原始 HTML。

Demo

<iframe srcdoc="<h1>HELLO</h1>"></iframe>
<iframe id="dynamic"></iframe>
<script>document.getElementById('dynamic').srcdoc = '<i>there</i>';</script>

适用于除 MS 浏览器以外的所有浏览器。
使用 sandbox使其更加安全。