通过JavaScript向动态生成的脚本标记添加延迟或异步属性

我动态地将脚本标记放入我页面的DOM中，如下所示：

var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

<script src="https://www.youtube.com/iframe_api"></script>

<script src="https://www.youtube.com/iframe_api" defer async></script>

这将产生如下结果：

var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

<script src="https://www.youtube.com/iframe_api"></script>

<script src="https://www.youtube.com/iframe_api" defer async></script>

---

那么如何使用JavaScript实现这一点呢？

无需将

async

添加到

script

标记中，因为该属性用于动态脚本

至于

defer

，正如您在JavaScript中更改

src

属性一样，您也可以这样启用该属性：

var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
tag.defer = true;
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

或者，您可以使用

var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
tag.setAttribute('defer','');
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

---

怎么样

tag.defer=true

？MDN上的链接文章没有提到异步是动态脚本标记的默认值。你能准确地引用它在哪里这么说吗？动态脚本是用

async

标志创建的。我可以为动态脚本设置延迟属性，但找不到它的存在有什么区别。我可以知道它是否会有任何影响吗？我的意思是，它的行为是否像一个带有延迟属性的静态脚本？