如何解决“allow属性将优先于allowfullscreen”警告？

Question

allow属性将比'allowfullscreen'属性优先。

我收到了这个警告信息，因为我已经添加了一个同时带有allow="fullscreen" 和 allowfullscreen的iframe。

根据https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe，allow在IE、Edge和Firefox中似乎不起作用。

如何以跨浏览器兼容的方式解决/消除此警告信息？

以下是一个最小化的代码段，可在Chrome中重现该警告：

const iframe = document.createElement('iframe');
iframe.setAttribute('allowFullScreen', '');
iframe.setAttribute('allow', 'fullscreen');

- Andrew Rasmussen

Answer 1

原来，交换这些setAttribute行的顺序可以消除警告：

const iframe = document.createElement('iframe');
iframe.setAttribute('allow', 'fullscreen'); // must be 1st
iframe.setAttribute('allowFullScreen', '');

- Andrew Rasmussen

Answer 2

在Vimeo的嵌入iFrame中，完全删除allowFullScreen。

源自

<div class="embed-responsive embed-responsive-16by9"><iframe src="https://player.vimeo.com/video/000000000" allow="autoplay; fullscreen" allowfullscreen></iframe></div>

To

<div class="embed-responsive embed-responsive-16by9"><iframe src="https://player.vimeo.com/video/000000000" allow="autoplay; fullscreen"></iframe></div>

- Nicolas Berthier

---

我们已经在Vimeo.com上更新了嵌入代码生成，现在只包含allow属性，因此在使用更新的嵌入代码时不再会出现警告。如果您有现有的嵌入式内容，如果目标浏览器不需要，您可以删除allowfullscreen属性。 - aaronm67