javascript 在 jQuery 之前加载 准备好了吗？

Question

JS 是新人，被交给了一个项目来接管。我遇到了一种情况，我能够开始工作(并且花了我很长时间才做到这一点)，但我不明白其背后的 JS 内部原理。有人能解释一下吗？

我有一个 JS 文件，其中有两个不同类型的函数 block ，我将其称为 last.js b/c 它是列出的最后一个文件:

1. 传递 jQuery 对象的立即函数

(function ($) {
...
}(jQuery));

之后您就有了标准的 jQuery 文档加载代码:

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

这个 JS 文件是我的页面上引用的最后一个文件，我认为它将是页面执行时最后一个调用/加载的文件。但事实并非如此。首先调用立即函数 (1)。接下来，加载并执行 jqueryvalidation.js 文件。最后，调用last.js中的jQuery read()函数。

因此，这有效地在我的其他 js 库之前运行立即函数，然后按顺序加载/运行其他 js 文件，最后返回到我的 last.js 文件并完成它。如何在 jqueryvalidation.js 文件之前调用列表中的最后一个文件？并且立即函数是通过 jQuery 传递的，因此 jQuery 必须已经加载，并且页面应该在那时准备好。

要使用 jqueryvalidation.js，我必须将自定义验证代码放在立即窗口中。如果我把它放在 jQuery 就绪函数中，它会在验证代码解析页面后被调用，并且不执行任何操作。

为什么同一个js文件中的这两个函数会有完全不同的执行顺序？

Answer 1

$(function(){})是 $(document).ready(function(){}) 的简写，这意味着在文档加载之前不会执行。

所以，这里发生的是你的代码正在运行，当它到达 $(function(){}) 时，它将一个函数添加到事件队列中，然后运行其余代码。

然后进入下一个 <script>标签等等，直到解析页面。一旦 DOM 准备就绪，您的函数就会运行。