Javascript 如何设置更多window.onload事件？

我有三个函数，我想在加载页面时调用它们。我试过这个：

window.onload = [function f1(){...}, function f2(){...}, function f3(){...}];

---

不幸的是，这不起作用。我不知道该如何管理它。

只需将所有函数包装在一个匿名函数中即可

window.onload = function(){
  f1();
  f2();
  f3();
}

---

您不能设置多个事件处理程序，它不受支持。如果需要执行多个函数，则只需依次调用它们：

function f1() { ... }
function f2() { ... }
function f3() { ... }

window.onload = function() {
    f1();
    f2();
    f3();
}

大多数javascript库为您提供了向事件处理程序添加多个函数调用的方法，并将为您进行链接。例如，使用jQuery可以执行以下操作：

$(window).load(function() { ... });
$(window).load(function() { ... });
$(window).load(function() { ... });

这不会用新的调用覆盖以前的调用，但会将所有三个都设置为从

onload

事件调用

更新：另一种处理方法是在

窗口

对象上使用

addEventListener

function f1() { ... }
function f2() { ... }
function f3() { ... }

window.addEventListener("load", f1);
window.addEventListener("load", f2);
window.addEventListener("load", f3);

甚至

window.addEventListener("load", function() { ... });
window.addEventListener("load", function() { ... });
window.addEventListener("load", function() { ... });

---

这两个代码段与第一个代码段等效，并且彼此等效。

您可以在从一个函数调用函数之前定义函数：

window.onload = function () {
    f1();
    f2();
    f3();
}

---

使用，您可以为

onload

定义多个侦听器。侦听器按定义的顺序执行。

使用函数动态添加它们：

function addWindowOnload(next) {
    var prev = window.onload; 
    window.onload = function() {
        if (prev) prev();
        next();
    };
}

---

在混淆代码的范畴下，这里有一个被认为是大脑锻炼的选项：

window.onload = function() {
  return this.forEach(Function.prototype.call, Function.prototype.call);
}.bind([function f1(){...}, function f2(){...}, function f3(){...}]);

---

它将在实现

Array.forEach（）

和

Function.prototype.bind（）

的浏览器上运行。请尝试

addEventListener

方法：我认为

addEventListener

对于这一要求来说是过度的，并且由于浏览器兼容性问题而不理想。此外，在支持闭包的语言（如JavaScript）中使用函数链接机制也很容易。请看下面我的答案。@Teemu同意。我更新了我的答案，使之更加明确。