javascript - 如何知道页面上是否加载了所有内容？

Question

我正在构建一个包含大量 ajax 调用并动态创建 DOM 的页面。了解是否进行了所有 ajax 调用以及所有 DOM 元素是否已完成构建的最佳方法是什么？!我尝试了以下 prototype.js 事件观察器:

Event.observe(window, 'load', function () {
 alert("Loaded!");
}); 

但似乎在警报触发后某些元素仍在加载。我正在 IE 上尝试这个。

Answer 1

您需要通过将代码添加到它们的success(或complete)处理程序来响应ajax 调用完成。

例如，假设您要执行三个 ajax 调用来填充 DOM。在每次 ajax 调用之后，将一些全局计数器递增 1，然后调用一个函数来检查计数器是否为 3(这意味着所有的 ajax 调用都已完成)。如果是，您将运行 alert('Loaded!');。

如果您使用 jQuery 进行 ajax 调用，则使用 $.Deferred() 对象更容易做到这一点。