判断 JavaScript 加载完成的方法有:监听 DOMContentLoaded 事件,推荐使用,最可靠监听 window.onload 事件,准确性较低,适用于页面所有加载完成轮询方法,适用于无法使用事件监听器的情况使用 Promise,处理异步 JavaScript 加载

如何判断 JavaScript 加载完成
在 Web 开发中,判断 JavaScript 加载完成对于确保应用程序正确运行至关重要。有几种方法可以实现这一点:
1. 监听 DOMContentLoaded 事件
当 DOM(文档对象模型)加载完成时,触发 DOMContentLoaded 事件。这是判断 JavaScript 加载完成的最可靠方法。
document.addEventListener("DOMContentLoaded", function() {
// JavaScript 已加载完成
});2. 监听 window.onload 事件
window.onload 事件在页面加载完成时触发,包括图像、脚本和样式表。然而,它不如 DOMContentLoaded 事件准确,因为脚本可能会在页面加载后异步加载。
window.onload = function() {
// JavaScript 已加载完成
};3. 轮询方法
在某些情况下,可能无法使用事件监听器。在这种情况下,可以使用轮询方法来不断检查脚本是否已加载。
var interval = setInterval(function() {
if (window.scriptLoaded) {
// JavaScript 已加载完成
clearInterval(interval);
}
}, 100);4. 使用 Promise
可以使用 Promise 来处理异步 JavaScript 加载。当脚本加载完成时,Promise 将解析。
const scriptPromise = new Promise(function(resolve) {
document.addEventListener("DOMContentLoaded", function() {
resolve();
});
});
scriptPromise.then(function() {
// JavaScript 已加载完成
});最佳实践
- 根据应用程序需要选择最适合的方法。
- 尽量使用
DOMContentLoaded事件,因为它是最准确的。 - 避免使用
window.onload事件,因为它可能不太准确。 - 仅在必要时使用轮询方法。










