js文件的加载顺序

Question

我似乎无法让预加载器（查询加载器2）先加载页面上的其他所有内容。 当我刷新页面时，全屏滑块显示中的图像会阻止页面向下，然后查询加载器启动。 有没有一种方法可以在页面上的其他所有内容之前启动预加载器？

我经常使用堆栈溢出，通常会找到问题的答案，但是由于我对javascript的了解有限，这使我感到困惑。 我尝试过的事情：将对queryloader2的调用放在页眉顶部的页面顶部。 将调用放在页面底部的滑块脚本上，以便它们在预加载器之后加载。 将预加载器的z索引更改为高于滑块。 jQuery.getScript（）按顺序加载了脚本，但是仍然显示滑块，阻止了页面，然后启动了预加载器。

我认为这与加载顺序有关，但是如果您对我在做什么错有任何想法，在此您的帮助将不胜感激。

我已经链接到我的网站，因为我不知道要在此处放置哪段代码，因此您可以看到预加载器和滑块以错误的方式加载的方式http://stavriaphotography.com

Answer 1

该站点非常重视外部脚本。 这是在浏览器中加载资源的工作方式：

图片是异步加载的，这意味着浏览器在继续深入DOM之前不会等待图片加载。

JavaScript是同步加载的，您不能在前一个加载之前加载下一个。

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

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

您将jQ和queryLoader加载到头部，并准备在DOM准备好时调用它。 页脚中的脚本需要花费一些时间才能加载，并且延迟了$(document).ready()函数的调用。 同时，您体内有图像，并且由于图像是异步加载的，因此在queryLoader准备执行之前，浏览器开始加载图像。

在您的情况下，最简单的解决方案是将所有外部脚本都移到html标头中 ，但这不是一个非常实用的方法。

我建议您阅读一些JavaScript知识，然后将您的网站分成多个文件，以加快加载速度。

一些指针：jQuery.ajax（）和Handlebars.js，或者如果您真的想疯狂地使用RequireJS进入Backbone.js进行异步javascript加载。

希望这可以帮助！

Answer 2

首先将jQuery库

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>

然后添加其他JS文件