在 Meteor JS 中，如何控制与 DOM 加载顺序相关的 Javascript 加载顺序？对于动画

我已经下载了一个模板：

http://halibegic.com/projects/merlin/

我想在 Meteor 中使用它，但遇到了重大问题

<script src="assets/js/script.js"></script>

在第 444 行底部未按正确顺序加载。当页面加载时，该 js 文件中指定的 4 个函数都不起作用。

initNavbar(); initPortfolio(); initAnimations(); initTwitterFeed();

我的文件中有所有的 css、字体、图像和 js 文件public文件夹，并且它们都在 HTML 中正确引用。他们是not in the lib在其他所有内容之前加载的目录。

我认为这是因为脚本在 DOM 加载之前以某种方式加载，所以它没有 DOM 来应用东西。

我尝试过的事情：

• 当我改变名字时script.js to main.js并将第 444 行更改为<script src="assets/js/main.js"></script>动画仍然不起作用。

• 当我将其添加到脚本文件中时，它仍然无法正确加载：

  $(document).ready(function () { initNavbar(); initPortfolio(); initAnimations(); initTwitterFeed(); });

• 我可以

  Template.layout.rendered/created = function () { add in all the function code and call them here }

  但这似乎是一种令人难以置信、令人难以置信的混乱和低效的方法。我需要指定单个的加载顺序files，不是代码。我在此模板中有大约五个 .js 文件，我不想剪切它们的代码并将其全部粘贴到一个文件中Template.layout.rendered/created功能。

您所需要做的就是在模板呈现后加载 JavaScript。

Template.yourLayout.created = function() {
  $('head').append('<script type="text/javascript" src="assets/js/script.js">');
}

如果您在 $(window).load() 或 $(document).ready() 中加载了脚本，请记住也将其取出。您也可以在 $getScript 的承诺中运行它们。这是你的情况：

$.getScript('assets/js/script.js', function() {
      initNavbar();
      initPortfolio();
      initAnimations();
      initTwitterFeed();
      $(".loader .fading-line").fadeOut();
      $(".loader").fadeOut("slow");
});