问题:
如果我链接两个JavaScript文件，都是$(document)。准备好的函数，会发生什么?一个会覆盖另一个吗?或者同时执行$(document)。准备好接听电话了吗?
例如,
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type="text/javascript" src="http://.../jquery1.js"></script>
<script type="text/javascript" src="http://.../jquery2.js"></script>
jquery1.js:
$(document).ready(function(){
$("#page-title").html("Document-ready was called!");
});
jquery2.js:
$(document).ready(function(){
$("#page-subtitle").html("Document-ready was called!");
});
我相信最好的做法是将两个调用合并到一个$(文档)中。准备好了，但在我的情况下不太可能。
所有都将被执行，并且在第一次调用的基础上第一次运行!!
<div id="target"></div>
<script>
$(document).ready(function(){
jQuery('#target').append('target edit 1<br>');
});
$(document).ready(function(){
jQuery('#target').append('target edit 2<br>');
});
$(document).ready(function(){
jQuery('#target').append('target edit 3<br>');
});
</script>
正如你所看到的，它们并没有相互替代
还有一件事我想提一下
取而代之的是
$(document).ready(function(){});
你可以使用这个快捷方式
jQuery(function(){
//dom ready codes
});
文档$()时();和其他函数一样。一旦文档准备就绪(即加载)，它就会触发。问题是当多个$(document).ready()被触发时会发生什么，而不是当你在多个$(document).ready()中触发同一个函数时会发生什么
//this
<div id="target"></div>
$(document).ready(function(){
jQuery('#target').append('target edit 1<br>');
});
$(document).ready(function(){
jQuery('#target').append('target edit 2<br>');
});
$(document).ready(function(){
jQuery('#target').append('target edit 3<br>');
});
//is the same as
<div id="target"></div>
$(document).ready(function(){
jQuery('#target').append('target edit 1<br>');
jQuery('#target').append('target edit 2<br>');
jQuery('#target').append('target edit 3<br>');
});
两者的行为完全相同。唯一的区别是，前者虽然会取得相同的结果。后者的运行速度会快几分之一秒，需要的输入也更少。：）
总之，在任何可能的情况下只使用1 $(document).ready();
/ /老回答
它们都将被按顺序调用。最佳实践是将它们结合起来。
但如果不可能，也不要担心。页面不会爆炸。
