在完成页面加载后开始预加载内容

我正在尝试使预加载工作的方式使得希望预加载的组件在成功加载页面后开始加载。在完成页面加载后开始预加载内容

例如，我有index.php。我希望它完全加载。只要它加载，我想开始加载其他组件。

要说清楚。我有一个使用大尺寸图像的导航。如果我将它们与index.php文件一起加载，它会增加页面的加载时间。我希望在完成渲染index.php之后加载这些大图像？

我说得通吗？可能吗？

来源

2010-04-11 amit

只需将预加载函数附加到窗口对象的“加载”事件即可。在页面（和所有外部资源）完全加载后加载。

这与JQuery提供的各种库（如Ivo的答案）所提供的“DOMReady”事件不同。 $(document).ready(fn)将在DOM准备就绪（意味着完整的http文档已被接收/解析）但不等待外部资源（图像，css等）下载时触发。

相反，你要$(window).load()：

<script type="text/javascript"> 
preLoadStuff = function(){ 
    //code that does preloading goes here 
} 

$(window).load(preLoadStuff); 
</script>

这将所有图像后触发preLoadStuff处理程序等，完全加载。

来源

2010-04-11 18:51:32 timdev

$(document).ready(function() { YOUR CODE HERE });

http://api.jquery.com/ready/

来源

2010-04-11 18:05:21

不完全 - 此解决方案将在DOM准备就绪时触发代码，但不会等待外部资源加载。在这种情况下，他似乎希望等到其标记中引用的所有内容完全加载后，然后执行代码以预加载其他图像。 – timdev 2010-04-11 18:55:48

当DOM准备就绪时，所有标记都会被完全加载，这意味着页面已准备好在浏览器中可视化。他可以添加自定义的功能，将加载他的JavaScript（除jQuery以外）和图像，并触发$（document）.ready（） – 2010-04-11 19:50:33

的图像被加载在几乎平行于PHP程序的执行。这实际上取决于执行PHP程序所需的时间，您输出到浏览器的数据的速度传输等。
您不应该在处理index.php后尝试加载这些图像，那不会帮助，因为你的服务器是处理PHP脚本的人，而浏览器是应该获取图像的人。

让您的PHP程序尽快输出图像标签是很好的，并改善用户体验。

来源

2010-04-11 18:09:01 Dor

我不认为你了解网页的工作原理。在任何HTML输出甚至开始处理之前，index.php文件将执行它所需的一切，这只需要几毫秒。然后，HTML将开始按照页面上显示的顺序加载所有内容。在显示任何内容之前，页面不会等待图像完成加载。它会显示页面轮廓，因为它已经加载到目前为止，并且图像加载完成后，只需将它们插入到正确的位置。这听起来像你想要的东西已经是事情的方式。

来源

2010-04-11 18:09:33 animuson

在完成页面加载后开始预加载内容

回答

相关问题