什么是一个好方法来尝试加载托管的jQuery在谷歌(或其他谷歌托管库),但加载我的jQuery副本,如果谷歌尝试失败?

我不是说谷歌很古怪。在某些情况下,谷歌副本会被屏蔽(例如,显然在伊朗)。

我是否会设置一个计时器并检查jQuery对象?

两份拷贝都通过的危险是什么?

并不是真的在寻找像“只用谷歌”或“只用你自己的”这样的答案。我理解这些论点。我还知道用户可能缓存了谷歌版本。我在考虑云计算的后备方案。


编辑:这部分增加了…

因为谷歌建议使用谷歌。加载加载ajax库,它执行回调时,我想知道这是否是序列化这个问题的关键。

我知道这听起来有点疯狂。我只是想弄清楚它是否能以一种可靠的方式完成。


更新:jQuery现在托管在微软的CDN上。

http://www.asp.net/ajax/cdn/


当前回答

您可能希望使用本地文件作为最后的手段。

现在看来,jQuery自己的CDN不支持https。如果是这样的话,你可能会想先从那里加载。

这是序列: 谷歌CDN => 微软CDN => 本地副本。

<!-- load jQuery from Google's CDN -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
<!-- fallback to Microsoft's Ajax CDN -->
<script> window.jQuery || document.write('<script src="//ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.3.min.js">\x3C/script>')</script> 
<!-- fallback to local file -->
<script> window.jQuery || document.write('<script src="Assets/jquery-1.8.3.min.js">\x3C/script>')</script> 

其他回答

if (typeof jQuery == 'undefined')) { ...

Or

if(!window.jQuery){

将不工作,如果cdn版本没有加载,因为浏览器将通过这个条件运行,在它仍然下载剩下的javascript需要jQuery和它返回错误。解决方案是通过该条件加载脚本。

    <script src="http://WRONGPATH.code.jquery.com/jquery-1.4.2.min.js" type="text/javascript"></script><!--  WRONGPATH for test-->
  <script type="text/javascript">
  function loadCDN_or_local(){
    if(!window.jQuery){//jQuery not loaded, take a local copy of jQuery and then my scripts
      var scripts=['local_copy_jquery.js','my_javascripts.js'];
      for(var i=0;i<scripts.length;i++){
      scri=document.getElementsByTagName('head')[0].appendChild(document.createElement('script'));
      scri.type='text/javascript';
      scri.src=scripts[i];
    }
  }
  else{// jQuery loaded can load my scripts
    var s=document.getElementsByTagName('head')[0].appendChild(document.createElement('script'));
    s.type='text/javascript';
    s.src='my_javascripts.js';
  }
  }
  window.onload=function(){loadCDN_or_local();};
  </script>

还有另一个替代ajax.googleapis.com与cdnjs.cloudflare.com:

(function (doc, $)
{
    'use strict';

    if (typeof $ === 'undefined')
    {
        var script = doc.querySelector('script[src*="jquery.min.js"]'),
            src = script.src.replace('ajax.googleapis.com', 'cdnjs.cloudflare.com');

        script.parentNode.removeChild(script);
        doc.write('<script src="' + src + '"></script>');
    }
})(document, window.jQuery || window.Zepto);

你可以通过在字符串中指定一个jQuery版本 完美的资产管理,不与HTML剪辑工作 在野外测试-工作完美的用户从中国

你可以这样做:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>

<script>
       window.jQuery || document.write('<script src="/path/to/your/jquery"><\/script>');
</script>

这应该在页面的<head>中,任何jQuery就绪事件处理程序都应该在<body>中以避免错误(尽管这不是万无一错!)。

另一个不使用Google托管的jQuery的原因是,在一些国家,谷歌的域名是被禁止的。

在ASP中使用Razor语法。NET,这段代码提供了回退支持,并使用虚拟根:

@{var jQueryPath = Url.Content("~/Scripts/jquery-1.7.1.min.js");}
<script type="text/javascript">
    if (typeof jQuery == 'undefined')
        document.write(unescape("%3Cscript src='@jQueryPath' type='text/javascript'%3E%3C/script%3E"));
</script>

或者制作一个helper (helper概述):

@helper CdnScript(string script, string cdnPath, string test) {
    @Html.Raw("<script src=\"http://ajax.aspnetcdn.com/" + cdnPath + "/" + script + "\" type=\"text/javascript\"></script>" +
        "<script type=\"text/javascript\">" + test + " || document.write(unescape(\"%3Cscript src='" + Url.Content("~/Scripts/" + script) + "' type='text/javascript'%3E%3C/script%3E\"));</script>")
}

像这样使用它:

@CdnScript("jquery-1.7.1.min.js", "ajax/jQuery", "window.jQuery")
@CdnScript("jquery.validate.min.js", "ajax/jquery.validate/1.9", "jQuery.fn.validate")

这似乎对我很管用:

<html>
<head>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
// has the google object loaded?
if (window.google && window.google.load) {
    google.load("jquery", "1.3.2");
} else {
    document.write('<script type="text/javascript" src="http://joecrawford.com/jquery-1.3.2.min.js"><\/script>');
}
window.onload = function() {
    $('#test').css({'border':'2px solid #f00'});
};
</script>
</head>
<body>
    <p id="test">hello jQuery</p>
</body>
</html>

它的工作方式是使用调用http://www.google.com/jsapi加载到窗口对象的谷歌对象。如果该对象不存在,则假设对谷歌的访问失败。如果是这种情况,我们使用document.write加载一个本地副本。(在这种情况下,我使用自己的服务器,请使用自己的服务器进行测试)。

我还测试了window.google.load的存在——我还可以做一个typeof检查,看看这些东西是否是适当的对象或函数。但我觉得这个很管用。

这里只是加载逻辑,因为代码高亮显示似乎失败了,因为我张贴了整个HTML页面,我正在测试:

if (window.google && window.google.load) {
    google.load("jquery", "1.3.2");
} else {
    document.write('<script type="text/javascript" src="http://joecrawford.com/jquery-1.3.2.min.js"><\/script>');
}

虽然我必须说,我不确定如果这是您的网站访问者的担忧,您应该摆弄谷歌AJAX Libraries API在所有。

有趣的事实:我最初尝试在各种版本中使用try. catch块,但找不到像这样干净的组合。我很有兴趣看到这个想法的其他实现,纯粹作为一个练习。