gpt4 book ai didi

javascript - js文件加载顺序

转载 作者:行者123 更新时间:2023-11-30 17:32:45 26 4
gpt4 key购买 nike

我似乎无法让预加载器(查询加载器 2)在页面上的其他所有内容之前加载。当我刷新页面时,全屏 slider 中的图像显示在页面下方,然后查询加载程序启动。有没有办法在页面上的其他所有内容之前启动预加载器?

我经常使用堆栈溢出,通常都能找到问题的答案,但由于我对 javascript 的了解有限,这个问题让我很困惑。我尝试过的事情:将对 queryloader2 的调用放在页面顶部的页眉中。调用页面底部的 slider 脚本,以便它们在预加载器之后加载。将预加载器的 z-index 更改为高于 slider 。jQuery.getScript() 按顺序加载脚本,但 slider 仍显示在页面下方,然后预加载器启动。

我认为这与加载顺序有关,但如果您对我在这里做错了什么有任何想法,我们将不胜感激。

我已经放了一个指向我的站点的链接,因为我不知道将哪一段代码放在这里,所以你可以看到预加载器和 slider 以错误的方式加载 http://stavriaphotography.com

最佳答案

该网站非常依赖外部脚本。以下是在浏览器中加载资源的工作方式:

图像 是异步加载的,这意味着浏览器不会等待图像加载后再继续向下DOM,但是

JavaScript 是同步加载的,您可以在加载前一个之前加载下一个。

jQuery $(document).ready() 函数仅在 DOM 完全加载时触发。

这是您网站上发生的事情:

您在头部加载 jQ 和 queryLoader 并准备在 DOM 准备好时调用它。页脚中的脚本需要时间来加载并延迟 $(document).ready() 函数调用。与此同时,您的 body 中有图像,并且由于它们是异步加载的,因此浏览器会在 queryLoader 准备好执行之前开始加载它们。

The most simple solution in your case would be to move all the external scripts to your html header, however not a very practical one.

我建议您阅读一些有关 JavaScript 的内容,并将您的站点拆分为多个文件以加快加载速度。

一些建议:jQuery.ajax() 和 Handlebars.js,或者如果您真的想疯狂地使用 RequireJS 深入研究 Backbone.js 以进行异步 javascript 加载。

希望这对您有所帮助!

关于javascript - js文件加载顺序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22653017/

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