当你在同一个HTML页面上使用两个JavaScript文件中有两个jQuery $（document）.ready调用时会发生什么？

Question

我对jQuery $(document).ready

有疑问

假设我们有一个HTML页面，其中包含2个 JavaScript 文件

<script language="javascript" src="script1.js" ></script>
<script language="javascript" src="script2.js" ></script>

现在让我们说在这两个脚本文件中，我们有$(document)如下

在 script1.js ：

内

$(document).ready(function(){
    globalVar = 1;
})

在 script2.js ：

内

$(document).ready(function(){
    globalVar = 2;
})

现在我的问题是：

  

  
1. 这两个就绪事件函数都会被触发吗？
  
2. 如果是，那么他们被解雇的顺序是什么，因为   文件将在同一时间准备好   两个人的时间？
  
3. 这种方法是推荐还是我们理想情况下应该只有1   $（文件）.ready？
  
4. 所有浏览器（IE，FF等）的执行顺序是否相同？
  

谢谢。

Answer 1

  

  
1. 这两个就绪事件函数都会被触发吗？
  

是的，他们都会被解雇。

  

  
1. 他们被解雇的顺序是什么，因为文件将同时为两者准备好？
  

以它们出现的方式（从上到下），因为ready事件将被触发一次，并且所有事件侦听器将一个接一个地得到通知。

  

  
1. 是推荐这种方法还是理想情况下我们应该只有1 $（文件）.ready？
  

这样做是可以的。如果你可以在同一个区块代码中使用它们，那么管理起来会更容易，但这就是它的全部内容。 更新：显然我忘了提及，如果您在多个文件中执行此操作，则会增加JavaScript代码的大小。

  

  
1. 所有浏览器（IE，FF等）的执行顺序是否相同？
  

是的，因为jQuery采用了跨浏览器规范化。

Answer 2

请参见此处：jQuery - is it bad to have multiple $(document).ready(function() {});和此处：Tutorials:Multiple $(document).ready()

1. 是
2. 附加顺序。 jQuery internally与Deferred objects保持readyList。
3. 这部分是品味问题。拥有一个就绪处理程序将为您提供所有正在发生的事情的精彩概述，而多个（即每个包含的文件一个）将使您的代码更加模块化（即，您可以包含或删除.js文件，并确保它提供并绑定自己的就绪处理程序。）
4. 是 - 附加顺序。

Answer 3

在任何当前浏览器中，您可以指望在第二个脚本引用之后按顺序执行的两个处理程序和globalVar为2。

Answer 4

如果您想要完全控制，我强烈建议仅一个 $（文档）.ready（）;

如果您通过 ajax 加载HTML的部分内容，并且ajax响应包含$（文档）.ready（）; - 脚本并且您想要触发$（document）.ready（）;来自 ajax回调中的script1.js，script2.js等等。你必须复制PLENTY代码....

祝你好运！

/ $（window）.ready（）;的;）

Answer 5

1. 两人都会被解雇
2. 一旦尘埃落定，变量的值将为2。
3. 不推荐的主要内容是使用2个不同的JS文件，如Google PageSpeed和Yahoo YSlow建议，最好将所有Javascript代码放在同一个文件中。 就同​​样的事件处理程序而言，说实话，我认为没有理由这么做，而且只会让你的代码可读性变得更糟。
4. 我没有答案。