1

我不确定我是否正确使用了 head.js。在我的 html 文档的标题中，我通过以下方式调用 head.js 文件：

<script src="/scripts/head.min.js" type="text/javascript"></script>

然后就在 html 页面中的结束 </body> 标记之前，我调用了以下文件：

<script src="/scripts/load.js" type="text/javascript"></script>

在 load.js 文件中，我有以下代码：

head.js(

   {livechat: "/scripts/livechat.js"},
   {jquery: "http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"},
   {jquerytools: "http://cdn.jquerytools.org/1.2.5/full/jquery.tools.min.js"},
   {slider: "/scripts/jquery.nivo.slider.pack.js"},
   {prettyphoto: "/scripts/jquery.prettyPhoto.js"},
   {sliderfunctions: "/scripts/slidercode.js"},
   {functions: "/scripts/functions.js"}

);

上面的代码是否会导致 javascript 文件按照它们列出的完全相同的顺序执行，或者它们有时会乱序执行？

我问是因为滑块最初只有在我在 load.js 中使用以下代码时才起作用：

head.ready("slider", function() {
   $('#slider').nivoSlider({
      effect:'sliceDown',
      controlNav: false
   });
});

我可以通过将上面的代码移动到一个名为 slidercode.js 的外部文件来解决这个问题，该文件包含以下代码：

$(window).load(function() {
$('#slider').nivoSlider({
        effect:'sliceDown',
        controlNav: false
    });
});

但是我不确定我是否会以正确和最有效的方式来解决这个问题，因为这是我第一次使用 head.js。基本上来自 loader.js 中的 javascript 文件，我需要确保：

  1. jquery 首先加载。
  2. 一旦 jquery 完全加载，然后 jquerytools 加载
  3. jQuery完全加载后，它应该先加载滑块，然后再加载prettyphoto。
  4. 然后滑块函数应该加载，因为它依赖于滑块，
  5. 最后，函数应该加载，因为它依赖于 jquery 和 jquerytools。
4

2 回答 2

1

您应该像这样调用脚本：（也删除 http，它不需要。此外，Jquery 总是首先加载任何脚本。在这种情况下，headJS 优先于 jquery，然后是所有脚本）

<script src="/scripts/head.min.js" type="text/javascript"></script>
// this loads asyncrounously & in parallel
head.load("//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js", "//cdn.jquerytools.org/1.2.5/full/jquery.tools.min.js", "/scripts/jquery.nivo.slider.pack.js", "/scripts/jquery.prettyPhoto.js", "/scripts/slidercode.js", "/scripts/functions.js");

然后就在 html 页面中的结束 </body> 标记之前，我调用了以下文件：

<script>
head.ready(function () {
        // some callback stuff
        $('#slider').nivoSlider({
    effect:'sliceDown',
    controlNav: false
});
    });
<script>
于 2014-01-30T15:32:07.130 回答
0

上面的代码是否会导致 javascript 文件按照它们列出的完全相同的顺序执行，或者它们有时会乱序执行？

是的，它们加载异步，但按顺序执行。

我认为head.ready("slider", function() {} );即使你把它放在外面也应该工作load.js。尝试在 load.js 脚本块之后添加它。

于 2014-08-11T03:02:07.333 回答