jquery - 如何异步加载jquery及其依赖脚本

Question

我在异步加载 jquery 时遇到问题。正如我所看到的，如果我加载不依赖于其他库文件的 javascript，它可以完美工作，但使用异步加载 jquery 脚本及其库文件则不起作用，并抛出错误，提示 $ is not Defined

下面的脚本位于 head 标签中

<script async src="../js/jquery/jquery-1.10.1.min.js">    </script>
<script async src="../js/vendor/modernizr-2.8.2.min.js"></script>
<script async src="../js/asynchronous-resources/2014-06-03-asynchronous-resources.js">   </script>

下面的 main.js 位于页脚中，就在 body 标记结束的上方。

<script async src="../js/main.js"></script>

上面的脚本抛出错误。如何异步加载 jquery 及其依赖项。

任何帮助将不胜感激。

提前致谢。

Answer 1

您可以尝试几个选项

如果您想按照 html 中指定的顺序执行脚本，那么 defer 就是您所需要的。

异步和延迟脚本立即开始下载，无需暂停解析器。 async 和 defer 之间的区别主要在于脚本执行的时间。

异步脚本在下载完成后、窗口加载事件之前第一时间执行。

延迟脚本保证按照它们在页面中出现的顺序执行。该执行在解析完全完成之后、文档的 DOMContentLoaded 事件之前开始。

既然您已经在使用Modernizr，也许您可​​以尝试Modernizr.load

或使用require.js