gpt4 book ai didi

javascript - 如何检查 DOM 元素是否已完全加载?

转载 作者:行者123 更新时间:2023-12-05 06:44:26 29 4
gpt4 key购买 nike

我正在加载包含数千个元素的非常大的网页。我如何测试节点是否已完全加载,包括它自身及其所有子元素,但我不想等待整个页面加载。例如让这个页面:

<html>
<head>
<script>
var cnt = 0;
var id = setInterval(function test() {
var e = document.querySelector('#content')
if (!e) return;
// how to test is "e" fully loaded ?
if (cnt == e.childNodes.length) {
clearInterval(id);
} else {
cnt = e.childNodes.length;
console.log(cnt);
}
}, 10);
</script>
</head>
<body>
<div id="content">
<div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div>
<!-- ... add 30k div elements -->
</div>
</body>
</html>

这将在控制台上打印类似这样的内容:

4448
9448
14448
19448
24948
30000

最佳答案

我认为 load 事件 是对您问题的更恰当的回答。它可以附加到元素并在加载所有内容(包括图像和其他资源)时触发。

您可以在此处找到一些示例。

https://developer.mozilla.org/en-US/docs/Web/Events/load https://www.w3schools.com/jsref/event_onload.asp

但如果您不关心资源,那么您可能想看看这个。

https://developers.google.com/speed/docs/insights/rules

关于javascript - 如何检查 DOM 元素是否已完全加载?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28916748/

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