是否有可能检测到HTML页面加载和渲染完成？如果可以，如何实现？
页面包含HTML、Ajax调用、从Ajax调用返回的数据、大量JavaScript内容以及一些图片。我希望能够检测到所有内容都已完成。但是我无法在最后添加一个函数调用，因为我不知道什么时候才是最后。
例如，页面有许多用户可以选择的Ajax样式元素，即用户1可能具有不同数量的元素，甚至是不同顺序。
因此，我不能使用最后一个函数来模拟HTML渲染的结束，因为我不知道哪个函数将是最后一个函数。
3个回答
10
回答您的问题存在于您所说的最后几句话中，因为用户的选择使您不知道结束在哪里。有两个自动事件可以绑定JavaScript。jQuery称之为
$(document).ready() 表示DOM已准备好进行操作（在图像加载之前以及在外部脚本和CSS加载之后），更常用的是body onload （在jQuery中可以编写为 $(window).load() ），它在所有静态资源都被获取后运行。您的Ajax调用将在至少DOM就绪后触发，没有定义事件来处理它们之后发生的情况。因此，您需要自己跟踪它们。您可以使用“最后一个马从谷仓出去”的方法。在您的Ajax调用末尾添加一小段逻辑，以查看它是否是最后一个并引发名为“reallyAllDone”的自定义事件。- Jason Sperske
0
- noel
6
1我刚刚尝试了在onload中使用警报。 警报出现在页面完成加载/渲染之前。 关闭警报允许页面的其余部分完成加载/渲染，但仍然不正确，因为我希望警报仅在屏幕上所有内容都加载完成后才出现。 - oshirowanen
你把onload事件附加到了body上？ - noel
我刚刚这样测试它
<body onload="alert('Loaded');"。 - oshirowanen尝试过了，但是出现了错误，页面无法完成加载。然而，window.load可以工作，但它与document.ready有相同的问题。 - oshirowanen
-2
$(document).ready
将帮助您了解DOM何时完成其事件并准备就绪
- Chandra Sekhar Walajapet
1
我把所有的ajax调用和jquery函数都放在$(document).ready()里了。这样做是不是不太好？我试着把所有东西都移到$(document).ready()之外，只在$(document).ready()里加了一个alert。结果整个页面只渲染了一部分，然后就弹出了alert。关闭alert并不能完成页面的加载。 - oshirowanen
网页内容由stack overflow 提供, 点击上面的可以查看英文原文，
原文链接
原文链接