我的 AJAX 应用程序基本上是一个 index.html 加上一堆 .js 模块。我的设置函数将 js 处理程序代码连接到适当的 DOM 元素。我怀疑我需要使用 window.onload() 而不是 jquery 的 $(document).ready() 因为所有 .js 文件都需要在连接时可用（即下载）。
我的理解是，只有 DOM 树在 $(document).ready() 处准备好了，但不能保证 .js 文件已经加载。对吗？
附言。我不需要多个 onload 处理程序；一个 window.onload() 对我来说很好。
【问题讨论】：
标签： javascript jquery window onload
在这种情况下你肯定有误解。在正文标记结束之前包含脚本标记被认为是最佳实践的全部原因是因为脚本加载是阻塞加载。除非另有特别编码（即；谷歌分析），JavaScript 文件是同步加载的。
也就是说，如果脚本文件之间存在依赖关系，那么加载文件的顺序可能很重要。
【讨论】：
不，只要您的脚本标签同步加载（在大多数情况下，这意味着“正常”），您就可以安全地使用$(document).ready()。浏览器在继续之前等待加载<script>。因此，$(document).ready() 包含源中的所有 <script> 标记。
如果脚本标签包含async 或defer 属性，则有两个例外。前面的意思是兼容的浏览器可以继续渲染页面，后面的意思是页面完成后执行脚本。
【讨论】：
我setup two文件作为测试：
syncscript.html
<html>
<head>
<title></title>
<style type="text/css">
</style>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
$(window).load(function(){
$(document.body).append('<p>window.load has run.');
});
$(document).ready(function(){
$(document.body).append('<p>document.ready has run.');
});
</script>
</head>
<body>
<p>Page has loaded. Now continuing page load and attempting to load additional script file (after 10 second pause).</p>
<script type="text/javascript">
var p = document.createElement('p');
p.innerHTML = '<p>Inline script preceding jssleep.php file has run.</p>';
document.body.appendChild(p);
</script>
<script type="text/javascript" src="http://jfcoder.com/test/jssleep.php"></script>
<script type="text/javascript">
var p = document.createElement('p');
p.innerHTML = '<p>This is an inline script that runs after the jssleep.php script file has loaded/run.</p>';
document.body.appendChild(p);
</script>
</body>
</html>
jssleep.php
<?php
header("content-type: text/javascript");
sleep(10);
?>
var p = document.createElement('p');
p.innerHTML = '<p>jssleep.php script file has loaded and run following <?php sleep(10); ?>.</p>';
document.body.appendChild(p);
这个输出（在 Firefox 中）：
页面已开始加载。现在继续页面加载并尝试 加载额外的脚本文件（暂停 10 秒后）。
jssleep.php 文件之前的内联脚本已运行。
jssleep.php 脚本文件已加载并在 .
这是一个在 jssleep.php 脚本文件之后运行的内联脚本 已加载/运行。
$(document).ready() 已运行。
$(window).load() 已运行。
【讨论】：
没错。不过window.onload 也需要下载 CSS 和图片，所以可能有点矫枉过正。
你可以这样做：
var scriptsToLoad = 0;
// for each script:
s = document.createElement('script');
s.type = "text/javascript";
s.src = "path/to/file.js";
scriptsToLoad += 1;
s.onload = function() {scriptsToLoad -= 1;};
// after all scripts are added in the code:
var timer = setInterval(function() {
if( scriptsToLoad == 0) {
clearInterval(timer);
// do stuff here
}
},25);
【讨论】：