gpt4 book ai didi

javascript - 为什么 window.onload 事件发生在 $(document).ready 之前?

转载 作者:可可西里 更新时间:2023-11-01 02:22:41 25 4
gpt4 key购买 nike

如本帖所述:window.onload vs $(document).ready() . window.onload 应该晚于 $(document).ready() 但在这个简单的代码中,日志会显示 onload事件在就绪事件之前执行?我在这里错过了什么?

<!DOCTYPE html>
<html>

<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
</head>

<body>
<h1>A Simple Site</h1>
<script>
$(document).ready(function() {
console.log("ready event fired");
})
window.onload = function() {
console.log("onload event fired");
}
</script>
</body>

</html>

最佳答案

问题不在于事件的顺序。它与围绕原生 DOM 事件的 jQuery 包装器一起使用。如果您尝试原生的 DOMContentLoaded,您会发现它总是在 window.onload 之前运行。但是 jQuery 事件$(document).ready 将在 DOMContentLoaded 之后几毫秒出现,在某些情况下也可能在 window.onload 之后,特别是如果页面没有像下面的代码那样加载太多。这是由于 jQuery 实现造成的延迟。

如果您取消注释代码中的 iframe,则加载需要一些时间,这会导致 window.onload 延迟,因此 $(document).ready会先来。

<!DOCTYPE html>
<html>

<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
</head>

<body>
<h1>A Simple Site</h1>
<!-- <iframe src="http://stackoverflow.com"></iframe> -->
<script>
$(document).ready(function() {
console.log("jQuery ready");
})

document.addEventListener("DOMContentLoaded", function(event) {
console.log("DOM ready");
});

window.onload = function() {
console.log("DOM loaded");
}
</script>
</body>
</html>

关于javascript - 为什么 window.onload 事件发生在 $(document).ready 之前?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40608801/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com