时间戳

首页 > 解决方案 > 当动态标签不异步时，它们的执行/行为是否不同？

javascript - 当动态标签不异步时，它们的执行/行为是否不同？

问题描述

想象一下窗口已加载。eventListener'click'触发“动态脚本标签”的创建和附加（document.createElement(‘script’))到标题（或其他地方，我不确定它是否重要）。

阅读这篇文章，它说动态标签在添加到 DOM 后立即开始加载。它还说它们是async默认的——这意味着它们在加载后立即执行。

我在想，我们将动态标签配置为没有属性还是有defer？它可以有不同的行为吗？我的猜测是，由于没有其他脚本（因为初始加载.html已完成），它的行为与async（基本上，加载后立即执行）相同。

我知道常规脚本和延迟脚本在“初始执行”时的行为.html。现在我们不在这个初始执行中，我感到有点不自信。

.htmlPs 在初始执行ie 点击后创建动态标签是否奇怪/不常见？

标签： javascripthtml

解决方案

如果我们将动态标签配置为没有属性或延迟，会发生什么？

正如文章所说：async默认情况下它将具有属性。

这很容易验证：

let script = document.createElement('script');
console.log(`async: ${script.async}`);

它可以有不同的行为吗？

当然，只需设置您想要的属性：

let script = document.createElement('script');
script.async = true;
script.defer = true;

我的猜测是，由于没有其他脚本（因为 .html 的初始加载已完成），它将具有与异步相同的行为（基本上，一旦加载就执行）。

确切的行为取决于您加载其他资源的方式和顺序，以及浏览器实现。但总的来说，是的，你的假设是正确的。

在初始执行 .html （即通过点击）之后创建动态标签是否奇怪/不常见？

我会说它不是很受欢迎，但它绝对没有错。相反，它通常用于提高网站性能。例如，如果您在页面上使用第三方库（如 YouTube） - 您不需要加载它，除非用户点击视频。然后您可以附加脚本并加载库。

推荐阅读