Question

我以这种方式加载jQuery：

  function require(url, cb = new Function) {
    var s = document.createElement('script');
    s.src = url;
    // s.async=true; 
    // ^^^^^^^^^^^^ This is already removed, but the problem still existed.
    s.onload = cb;
    document.head.appendChild(s);
  }
  require(jquery_cdn_url, function(){
    try {
      alert($);
    } catch (e) {
      ga('send', 'pageview', e);
    }
  });

catch块中的错误不会一直发生。但是对于一些访问者（非常小的机会），因为我通过将信息发送到Google Analytics来跟踪这一点。

在此问题的先前版本中，脚本具有async属性。但是在实际项目中，我删除了它，错误仍然出现。

为什么会这样？有什么方法可以避免这种情况吗？

进一步的想法：

Google Analytics代码也是以这种方式加载的，因此，如果onload功能对某些用户代理无效，ga()也应向Google发送任何内容。
我想到了一种避免这种情况的方法：在try ... catch块中，使用＆＃34; xxx.html？load = sync＆＃34;这样的查询重新加载失败的案例。然后我在服务器端进行一些检测，如果有load=sync查询，那么我输出内联同步JavaScript标记的代码。这听起来像是一种可能的解决方法，但并不完美，因为它需要另外重新加载（更多浪费的网络请求）和一些服务器端编程工作量。

Answer 1

您不是说问题出现在哪些浏览器中，而是支持跨浏览器onload的{{1}}标记的script属性

此可能导致您遇到的问题 - 检查用户代理字符串以查看浏览器版本是否匹配。

显然，旧版IE中的正确方法是使用onreadystatechange。 seems to be spotty.是一篇文章，展示了它是如何完成的。

要记住的另一个细节是Here以保证onload处理程序实际被触发。看起来这可能不是你问题的原因：如果这出错了，处理程序根本不会被解雇。

Answer 2

我做了一个fiddle，似乎有效。我认为解决方案是将代码放在onload事件中。此外，您可能会遇到缓存清除问题，请参阅this question。

＆＃13;

window.onload = function() {
  function require(url, cb = new Function) {
    var s = document.createElement('script');
    s.src = url;
    s.async = true;
    s.onload = cb;
    document.head.appendChild(s);
  }
  require('https://code.jquery.com/jquery-2.2.4.min.js', function(){
    alert($); //ReferenceError: $ is not defined
  });
};

＆＃13;

Answer 3

CDN网址已加载到您的$scope.dish.comments.push($scope.putComment);功能添加的脚本标记中，但CDN网址将占用圆顶时间从网络加载js文件。它将首先发出一个获取请求然后将获得包含文件内容的响应，然后只有jquery完全加载并且您可以访问$。虽然这也取决于你的网速。有时你会很快得到CDN js内容，有时可能需要很长时间。

为什么jQuery仍然未定义但脚本标记被加载的可能性非常小？

3 个答案: