为了让函数只在页面加载完毕后才得到执行，我们会把函数绑定到onload事件上：
[removed] = userFunction
但如果有两个函数：firstFunction() 和 secondFunction()，都想让它们在页面加载完毕后得到执行，该怎么办？如果这样：
[removed] = firstFunciton;
[removed] = secondFunction;
只有最后一个函数能被执行。由此可得：每个事件处理函数只能绑定一条指令。
但我们可以这样做：
[removed] = function(){
firstFun
在JavaScript编程中，确保函数在页面完全加载之后执行是非常常见的需求，这通常通过将函数绑定到`window.onload`事件来实现。当`window.onload`事件触发时，绑定的函数会被调用，以此来确保所有资源（如图片、脚本等）都已加载完毕。然而，如果试图将多个函数绑定到同一个`onload`事件处理函数，会遇到问题，因为每个事件处理函数只能关联一个函数。
例如，如果我们有`firstFunction()`和`secondFunction()`两个函数，我们可能会尝试像下面这样绑定它们：
```javascript
window.onload = firstFunction;
window.onload = secondFunction;
```
在这种情况下，`secondFunction`会覆盖`firstFunction`，导致`firstFunction`不会在页面加载时执行。这是因为`window.onload`属性只能存储一个函数引用，而后面的赋值操作会替换掉之前设置的函数。
为了解决这个问题，我们可以创建一个包裹函数，将多个函数调用合并到一起：
```javascript
window.onload = function() {
firstFunction();
secondFunction();
};
```
这样的确可以解决问题，但是当需要绑定更多函数时，代码会变得冗长且不易维护。为了解决这个问题，Simon Willison提出了一个优雅的解决方案，即`addLoadEvent`函数。这个函数接受一个参数，即需要在页面加载完成后执行的函数名，并确保这个函数被正确地添加到`window.onload`事件处理函数中，即使已经有其他函数在那里注册过。
`addLoadEvent`的工作原理如下：
1. 获取当前`window.onload`事件处理函数的值，将其存储在`oldonload`变量中。
2. 检查`window.onload`是否已经是一个函数。如果不是（也就是说，还没有其他函数绑定到`onload`事件），那么就直接将传入的函数`func`赋值给`window.onload`。
3. 如果`window.onload`已经是一个函数，那么创建一个新的匿名函数，这个匿名函数首先调用`oldonload`（即之前绑定的函数），然后调用传入的`func`函数。这样，新函数就会在原有函数执行完毕后执行。
以下是`addLoadEvent`函数的代码实现：
```javascript
function addLoadEvent(func) {
var oldonload = window.onload;
if (typeof window.onload != 'function') {
window.onload = func;
} else {
window.onload = function() {
oldonload();
func();
};
}
}
```
现在，我们可以使用`addLoadEvent`轻松地将多个函数添加到`onload`事件中，如下所示：
```javascript
addLoadEvent(firstFunction);
addLoadEvent(secondFunction);
```
这种做法不仅避免了覆盖已有函数的问题，还使得代码更加模块化，易于扩展和维护。`addLoadEvent`函数创建了一个逻辑上的事件处理函数队列，确保所有绑定的函数都能按顺序在页面加载完成后执行。在实际的前端开发中，这种方法尤其有用，特别是在需要集成多个库或插件，每个都需要在页面加载后执行特定操作的场景下。
