javascript - $(document).ready(initialize) 和 $(document).on('ready', initialize) 有什么区别？

Question

有什么区别：

$(document).ready(initialize); 

和

$(document).on('ready', initialize); 

在我看来，它们似乎以同样的方式工作。

Answer 1

$(document).on('ready',initialize); 如果在执行文件时 DOM 已经准备好，则不会工作。

$(document).ready()对此有一个特殊处理：它确保它总是被调用

Answer 2

TL;博士

• $(document).on('ready', ...)已弃用，因为它不执行DOM 完全解析后绑定的回调。它获取事件对象作为第一个参数。

• $().ready()将引用jQuery作为第一个参数传递。

---

详细解答

$(document).on('ready', initialize);

该表达式将一个ready事件处理程序绑定到，就像您对任何其他事件处理程序document所期望的一样。从 jQuery 1.8开始，不推荐使用它来监听 DOM 就绪：

从 jQuery 1.8 开始，还有$(document).bind("ready", handler),已弃用。这与该方法的行为类似，ready但如果 ready 事件已经触发并且您尝试.bind("ready")绑定的处理程序将不会被执行。以这种方式绑定的就绪处理程序在上述其他三种方法的任何绑定之后执行。

请注意，这ready是一个自定义事件，由 jQuery内部触发。这也意味着您可以手动触发它，这可能会搞砸。

---

$(document).ready(initialize);

此表达式并不真正绑定事件处理程序。jQuery.fn.ready是一种专用方法，用于注册回调，以便在 DOM 完全解析时运行。jQuery 正在将回调添加到一个promise对象，而您传递给哪个选择器并不重要$。

此外，回调传递的是对 jQuery 对象的引用，而不是事件对象。

---

源代码的以下部分很好地显示了像这样注册的回调的处理方式不同：

// If there are functions bound, to execute
readyList.resolveWith(document, [jQuery]);

// Trigger any bound ready events
if (jQuery.fn.trigger) {
    jQuery(document).trigger("ready").off("ready");
}