Javascript 如果未加载jQuery，请从外部源加载jQuery

从源代码加载jQuery

我喜欢做的是删除我的本地jquery.js并 它在别的地方寄宿。但如果谷歌倒闭了呢？所以 让我们编写一个回退代码，如果jQuery “仍然”未加载

我做了这个测试用例，但它似乎不起作用，也许 有人可以帮我：

问题 如果您使用Firebug并查看jQuery的加载位置，您可以看到taht Google成功地加载了它。为什么它似乎不起作用？因为请求是异步的，当脚本同步运行时，它会在加载第一个脚本之前执行所有步骤

因此：

jQuery不存在

添加要从Google加载的脚本元素（浏览器发送请求并继续执行脚本）

jQuery不存在添加其他源

等等

解决方案 您应该做的是附加到脚本加载元素的

onLoad

事件，并在加载后检查jQuery

与向internet上的某个服务器发送请求并将结果返回以进行处理相比，脚本的执行速度非常快

附加说明

---

正如我所读到的，使用这种技术检测404会有问题。建议的方法是使用Ajax（XHR），然后附加脚本元素并向其中添加接收到的内容。这对于所有浏览器来说都是最可靠的方法。

脚本的问题在于，在测试jQuery是否已加载之前，您没有等待脚本加载。改用类似的方式：

function loadScript(src, callback) {
    var head=document.getElementsByTagName('head')[0];
    var script= document.createElement('script');
    script.type= 'text/javascript';
    script.onreadystatechange = function () {
        if (this.readyState == 'complete' || this.readyState == 'loaded') {
            callback();
        }
    }
    script.onload = callback;
    script.src = src;
    head.appendChild(script);
}

function isjQueryLoaded() {
    return (typeof jQuery !== 'undefined');
}

function tryLoadChain() {
    var chain = arguments;
    if (!isjQueryLoaded()) {
        if (chain.length) {
            loadScript(
                chain[0],
                function() {
                    tryLoadChain.apply(this, Array.prototype.slice.call(chain, 1));
                }
            );
        } else {
            alert('not loaded!');
        }
    } else {
        alert('loaded!');
    }
}

tryLoadChain(
    'https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js',
    'http://ajax.microsoft.com/ajax/jQuery/jquery-1.4.4.min.js',
    'mine.js');

这相当有效（从以下方面）：

!window.jQuery&&document.write（unescape（“%3Cscript src=”js/libs/jQuery-1.4.2.js”%3E%3C/script%3E'））

这里是一个纯javascript解决方案，它首先检测jQuery是否可用。如果没有，则尝试CDN版本。如果不可用，它将尝试本地版本。处理404个错误。我在一个不知道网站是否包含jQuery的解决方案中使用了它

<script>
if (typeof jQuery === "undefined") {
  loadjQuery("//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js", verifyJQueryCdnLoaded);
} else 
  main();

function verifyJQueryCdnLoaded() {
  if (typeof jQuery === "undefined")
    loadjQuery("script/jquery-1.6.1.js", main);
  else
    main();
}

function loadjQuery(url, callback) {
  var script_tag = document.createElement('script');
  script_tag.setAttribute("src", url)
  script_tag.onload = callback; // Run callback once jQuery has loaded
  script_tag.onreadystatechange = function () { // Same thing but for IE
    if (this.readyState == 'complete' || this.readyState == 'loaded') callback();
  }
  script_tag.onerror = function() {
    loadjQuery("script/jquery-1.6.1.js", main);
  }
  document.getElementsByTagName("head")[0].appendChild(script_tag);
}

function main() {
  if (typeof jQuery === "undefined")
    alert("jQuery not loaded.");

  $(document).ready(function () {
    // Rest of your code here...
  });

}

</script>

if（jQuery的类型==“未定义”）{
loadjQuery（“//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js”，verifyjquerycdnload）；
}否则
main（）；
函数verifyjquerycdnloadded（）{
if（jQuery的类型==“未定义”）
loadjQuery（“script/jquery-1.6.1.js”，main）；
其他的
main（）；
}
函数loadjQuery（url，回调）{
var script_tag=document.createElement（'script'）；
script_tag.setAttribute（“src”，url）
script_tag.onload=callback；//加载jQuery后运行callback
script_tag.onreadystatechange=function（）{//除了IE之外，还有相同的功能
如果（this.readyState=='complete'| | this.readyState=='loaded'）回调（）；
}
script_tag.onerror=函数（）{
loadjQuery（“script/jquery-1.6.1.js”，main）；
}
document.getElementsByTagName（“head”）[0].appendChild（script_标记）；
}
函数main（）{
if（jQuery的类型==“未定义”）
警报（“jQuery未加载”）；
$（文档）.ready（函数（）{
//剩下的代码在这里。。。
});
}

罗杰的回答是不可思议的。这里，使用这个，它的两行

<script>window.jQuery || document.write('<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"><\/script>')</script> 
<script>window.jQuery || document.write('<script src="Content/Scripts/jquery-1.9.1.min.js"><\/script>')</script>

window.jQuery | | document.write（“”）
window.jQuery | | document.write（“”）

你能不能更明确一点你想做什么？谷歌倒闭会导致互联网崩溃。不用担心，像谷歌这样的CDN是不太可能崩溃的。围绕这种不太可能发生的事件编写代码可能会污染您的代码：（因此，在检查jQuery是否加载之前设置超时会有所帮助吗？mhh-我甚至可以删除tryLoadChain的源代码，而您的脚本仍然会发出警告：loaded…不适用于meno。更改第一个URL，这样您将获得404。它将停止执行。至少对我来说是这样。我在编写书签时尝试使用类似的内容“typeof jQuery==='undefined'”测试总是失败。结果表明，JIRA使用了一些使用jQuery的脚本，比如FancyBox，这导致将“jQuery”定义为函数，但“$”仍然没有定义。我在条件中更改了测试，jQuery将被正确加载。哇，我从未见过这么多用于解决如此简单问题的代码。你一定喜欢键入…：）有很多很好的方法可以将脚本节点附加到DOM中。

document.write

不在其中。@编辑器-需要解释吗？因为这里发布的几乎所有答案都依赖于document.write（）这似乎是做这件事的标准方法。简言之，因为它让你能够直接写入页面，它很容易被滥用，如果滥用不当，可能会造成安全漏洞。它在这里被降级，因为通常有更好的方法来做同样的事。作为补充说明，对于一个大型项目，看看AMD风格的loading，可能与require.js类似。@RobertChrist-顺便说一句，在那篇文章中，它说这是文档的合法用途之一。写吧……真漂亮！非常感谢！这正是我想要的！

<script>window.jQuery || document.write('<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"><\/script>')</script> 
<script>window.jQuery || document.write('<script src="Content/Scripts/jquery-1.9.1.min.js"><\/script>')</script>