脚本加载问题 - 确保脚本加载顺序答案

【问题标题】：Script Loading Issue - Ensuring Script Load Order脚本加载问题 - 确保脚本加载顺序
【发布时间】：2014-02-13 17:41:14
【问题描述】：

在 Web 开发中使用外部插件时（我正在努力使用 one here），我们经常得到建议：

确保以正确的顺序加载脚本：

脚本 1

脚本 2

脚本 3

...等

一旦页面完成加载，开发人员是否有一种简单的方法可以确认他的脚本是否以正确的顺序加载？假设有<script></script>标签以正确的顺序添加到代码中。

我查看了 chrome 时间轴，但那是一团混乱！我不知道先加载什么，之后加载什么......等等。

任何关于此事的建议将不胜感激。

谢谢。

【问题讨论】：

【解决方案1】：

通常，脚本是按照它们在代码中出现的顺序加载的。您也可以使用 RequireJS 库或类似的库来处理脚本依赖项。

如果您正在处理混乱的多个嵌套模板，或者动态加载并且不能确定 - 您可以使用 Chrome DevTools 的Network 标签。

只需按Scripts 过滤即可。行以它们处理的相同顺序出现。

【讨论】：

谢谢安里。我正在使用 ASP.NET MVC4 并使用嵌套的 Razor 视图/模板。我刚刚检查了网络选项卡，即使在代码中我添加了正确的脚本顺序。在 Chrome 中，我可以看到排序错误。 :( 我试过 require，但这只是给了我更多的错误。
webmasters.stackexchange.com/questions/27017/…
谢谢安里。我现在 100% 确定脚本以正确的顺序加载，但仍然无法让 this 工作。

【解决方案2】：

JavaScript 是 synchronous，直到我们使用 async 属性将其设置为 asynchronous：

<script async src="script.js">

建议依赖于其他库的外部插件在该库之后调用，例如：

<script type="text/javascript" src="script/jquery.min.js"></script>
<script type="text/javascript" src="script/plug-ins.js"></script>

可以加快页面速度的异步脚本加载详细信息，请访问：

编辑欢迎添加更多信息。

【讨论】：