javascript - 通过 jQUery 创建沙盒 iFrame

Question

我正在尝试使用 jQuery 创建一个没有任何权限的 iFrame。 我可以添加 iFrame 属性，但它需要一个值。我通过添加空值(“”)来使用肮脏的解决方案，但这是正确的方法吗？ 有没有更好的方法来创建无需许可的沙盒 iFrame？

$(function() {
  $('article').each(createIFrame);
});

function createIFrame() {
  setArticleContent($(this), 'hello sandbox');
}

function setArticleContent(article, content) {
  article.find('span>p').first().text('');
  $('<iframe>', {
    srcdoc: '<p>' + content + '</p>',
    frameborder: '0',
    sandbox: ' ',
    style: 'background:#00FF00',
  }).appendTo(article.find('span>p').first());
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<article>
  <span>
        <p>helloworld</p>
      </span>
</article>

Answer 1

I am using a dirty solution by adding an empty value (' ') but is this the right way?

它根本不脏，但是您应该注意，根据规范，您应该使用空字符串:

The value of the attribute can either be an empty string (all the restrictions are applied), or a space-separated list of tokens that lift particular restrictions

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe#attr-sandbox

$('<iframe>', {
  srcdoc: '<p>' + content + '</p>',
  frameborder: '0',
  sandbox: '', // note the space was removed
  style: 'background: #00FF00',
}).appendTo(article.find('span>p').first());

理想情况下，样式也应该通过外部样式表设置。