仅当元素加载完全完成时如何调用函数？答案

【问题标题】：How to call function only when element onload fully completed?仅当元素加载完全完成时如何调用函数？
【发布时间】：2017-08-13 17:18:19
【问题描述】：

我有一个 JS 问题，要么棘手，要么愚蠢，不确定。

所以，假设我需要在页面上的外部 JS 脚本完全加载完成时执行一个函数，否则我会得到一个错误。

案例一：

var s = document.createElement('script');
s.src = "http://somedomain/somescript.js"

function foo() {
doSomething;
}

s.onload = foo;

在这种情况下，函数本身分配给 onload，并且应该在脚本完成加载时运行。

案例2：

s.onload = foo();

在这种情况下，根据What is the different between window.onload = init(); and window.onload = init;，函数的返回结果是在加载完成时分配的，所以，函数可以在加载开始时开始执行，而不是在元素加载完成时开始执行，取决于浏览器。

案例3：

s.onload = function() {
doSomething;
}

这是棘手的部分。我认为这种语法应该像案例 2 一样执行，但我无法证实这一点。我只是定义函数还是同时定义和执行它？

【问题讨论】：

function() {...} 只是定义了一个匿名函数。你需要(function() {...})() 来立即调用它。
您好，脚本中有一个需要加载的函数，所以我需要等待脚本完全加载，然后才能处理此函数。问题是，这种语法s.onload = function() { doSomething(); } 是否真的会等到脚本完全加载，因为如果它会在原始脚本未加载时开始执行，则会出现错误。
@NiettheDarkAbsol 在哪里可以找到 window.onload 分配和执行的源代码？
Trying to fire the onload event on script tag的可能重复

【解决方案1】：

使用这个：

window.onload = function(){

    //running your function

}

【讨论】：

【解决方案2】：

尝试使用 addEventListener：

s.addEventListener("load", foo());

更多信息请参考 w3schools：addEventListener

【讨论】：