通过javascript将defer或async属性添加到动态生成的脚本标记中

我正在动态地将脚本标记放到我的页面的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); 

这应该生成这样的东西：

我只想对此脚本标记进行延迟或异步，如下所示：

那么我该如何使用javascript做到这一点？

Answer 1

不需要在script标记中添加async ，因为默认情况下会启用该属性，并且脚本将异步加载，除非被告知不要。

至于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); 

或者，您可以使用setAttribute() 。

 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);