Javascript 我应该使用iLife还是window onload来初始化？

以下两个代码段都有效：

在js文件中使用IIFE：

(function initialize() {
  txtInput = document.getElementById('txtInput');
  txtResult = document.getElementById('txtResult');

  txtInput.value = "0";
  txtResult.value = "0";

}());

在html文件中的窗口加载事件上调用initialize（）：

window.addEventListener('load', initialize, false);

---

一种方法比另一种更好；在性能方面还是其他方面？目前，我更倾向于向窗口对象添加事件侦听器，因为它更具可读性。

可能每种方法的结果都很重要，而不是性能。第一种方法立即运行，第二种方法等待dom就绪。最终的结果是，在第一种方法中，除非将脚本放在页面底部，否则textInput和textResult可能都没有定义。

这取决于您希望代码何时运行。如果希望代码尽快执行，可以使用IIFE，但如果不使用IIFE来保护变量和/或不污染全局范围，那么使用IIFE就毫无意义

(function initialize() {
    // do somthing
}());

或

将在同一时间点执行

如果您想推迟执行，web开发人员通常会使用三个时间点<代码>s在底部，DOMContentLoad和window.onload

• s底部的将在从服务器获取后执行

• DOMContentLoaded

  基本上在HTML解析器读取
  后立即执行
• 非常简化的

  窗口。在加载所有CSS、
  和
  后，将执行onload

---

请注意，实际上，对于

s上的

async

和

defer

等属性，这更为复杂。这就是为什么有大量可用的资源加载器。

在关闭

主体

元素之前的

脚本

元素（无论是内联加载还是外部加载）中的IIFE显然是最聪明的。它把平民搞糊涂了

document.addEventListener（'DOMContentLoaded'，function（）…

很容易理解。它几乎是通俗易懂的英语：事件侦听加载的DOM内容。因此，poof，威严消失了。注意这与

窗口onload

不同

---

我使用事件监听器，因为它遵循的是，它是一个专门构建的工具，它做它所说的事情（可能包括我甚至没有考虑过的东西/功能）。

它是window.addEventListener（'load'，initialize，false）->将在加载的dom内容上执行。实际上不是这样，当加载所有资源时，它将调用initialize，与第三方的内容差异可能很大。这完全取决于您是否打算在实际添加元素之前或之后运行此操作。如果您确定元素存在，请使用IIFE。@LShetty oops，修复了键入错误。不是这样等同于jQuery.ready（“，但等同于

$（window.load（））

除非mallgi01将其代码移到页面底部！明白了。我想这里的时间问题比性能更重要。看起来，window.onload在这方面提供了更大的灵活性。你同意吗？如果你想防止全局范围受到污染，并将执行推迟到加载DOM之前呢？听起来你会d需要同时使用IIFE和侦听DOMContentLoad（并将后者封装在前者中，是吗？）。不，在这种情况下，您不需要IIFE。您只需要绑定到DOMContentLoad事件的函数。JavaScript具有函数作用域，如果您不想，函数内的任何内容都不会泄漏。

// do somthing