0

我在网上搜索过,找到了一些答案,但没有一个有效。我只想让我的网站加载得更快。我已经缩小了我的图像。现在正在使用 jquery 并使用谷歌托管的版本。虽然它没有托管在我的网站上,但它是网站中最重的文件 (32kb),它在任何其他图像之前加载第二行。我尝试在正文结束标记之前添加一个 javascript,如下所示:

<script language="javascript">

      var e=document.createElement('script');
      e.setAttribute('type','text/javascript');
      e.setAttribute('src','http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js');

      document.body.appendChild(e)

      var f=document.createElement('script');
      f.setAttribute('type','text/javascript');
      f.setAttribute('src','myjs.js');
      document.body.appendChild(f)
  </script>

在 firebug 控制台上,它显示 jquery 是最后加载的。但是它也显示了未捕获的引用错误 $ 未定义,这是猜测当 jquery 未正确加载时出现的错误。

如果我将这两个 js 文件放在 head 标签内,一切正常。

我怎样才能完成这项任务?

谢谢。

4

2 回答 2

1

动态加载javascript文件会导致它们被异步加载,所以你不能保证哪个库会先加载。如果您需要强制执行顺序(就像使用 jQuery 之类的库一样),您需要向页面添加带有属性的script标签,如下所示:src

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="myjs.js"></script>

如果您将脚本标签添加为元素中的最后一个body元素而不是head,它将使加载速度更快(渐进增强)。

编辑正如其中一位评论者所说,您可以阅读此问题的答案以获取更多详细信息。

于 2013-04-16T15:05:27.943 回答
0

我无法在特定系统中强制脚本顺序,我能够通过将我的 jQuery 代码包装为addEventListener

<script><!--
(function() {
    'use strict';
    window.addEventListener('load', function() {
        // All resources loaded
        $('#my-selector').on('click', function(event){
            //Do something
        });
    }, false);
})();
//--></script>

这使我可以在文档底部加载 jQuery,并且在需要的 DOM 中进一步在我的代码中使用“$”。不是所有情况的完美解决方案,但符合我的目的;)

于 2018-08-31T03:42:39.583 回答