Question

当我使用Javascript动态地将<script>元素注入页面时，我指定首先执行的onload事件处理程序，注入元素下载的脚本或onload事件处理程序？

E.g。

var script = document.createElement('script');
script.src = "http://example.com/foo.js";
script.async = true;
script.onload = function() {
    console.log("foo.js is loaded");
};
document.getElementByTagName('head')[0].appendChild(script);

Answer 1

我想你可能想看看flux或redux和React.js。 Redux和flux允许您在从源获取后调度数据，而无需添加整个串事件侦听器。在没有这些框架的情况下添加加上发射数据是一件痛苦的事。

Answer 2

事实证明，根据the spec，脚本在分配给<script>元素的onload事件之前执行。

这是相关的引用，强调我的：

使用脚本块的源，获取脚本的URL，脚本块的类型作为脚本语言以及脚本元素的Document的Window对象的脚本设置对象来创建脚本。

如果脚本来自上面步骤中提取的资源，并且资源是CORS-cross-origin，那么也将muted errors标志传递给create a script algorithm。

这是脚本编译和实际执行的地方。



减少中和文档的ignore-destructive-writes计数器，如果它在前面的步骤中递增的话。



触发一个名为afterscriptexecute的简单事件，即在脚本元素处冒泡（但不可取消）。



如果脚本来自外部文件，则在脚本元素上触发一个名为load的简单事件。

否则，脚本是内部的;将任务排队以在脚本元素上触发名为load 的简单事件。

动态注入脚本元素时的执行顺序

2 个答案: