Question

我在用于初始化所有应用程序的脚本中包含此代码，它将google CDN中的jQuery加载到我们所有应用程序所需的其他几个内容中。然后当我们加载特定的程序功能时，我们检查以确保jquery已加载，以防CDN关闭。我遇到的问题是它仍在加载第二个。如果我在行alert("Test");之后添加一个简单的headTag.appendChild(jqTag);，它就可以正常工作，但是如果我删除了它，则会使用第二个。是什么给了什么？

它们是这样加载的：

<script type="text/javascript" src="i-initializer.js"></script>
<script type="text/javascript" src="i-program.js"></script>

初始化脚本：

if(typeof jQuery=='undefined'){
    var headTag = document.getElementsByTagName("head")[0];
    var jqTag = document.createElement('script');
    jqTag.type = 'text/javascript';
    jqTag.src = 'http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js';
    headTag.appendChild(jqTag);
}

然后在另一个脚本中我们有以下内容：

if(typeof jQuery=='undefined'){
    var header = document.getElementsByTagName("head")[0];
    var qtag = document.createElement('script');
    qtag.type = 'text/javascript';
    qtag.src = 'http://feedback.oursite.com/scripts/jquery-1.8.3.min.js';
    qtag.onload = checkjQueryUI;
    header.appendChild(qtag);
}
else
{
    jQCode();
}
jQCode() {
...
}

Answer 1

这是HTML5 Boilerplate使用的技术。首先，它加载Google CDN脚本，然后立即检查全局jQuery对象是否存在 - 如果不存在，则CDN失败并加载本地副本。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.8.3.min.js"><\/script>')</script>

Answer 2

您的备用代码异步加载jQuery 这意味着其余的脚本在jQuery加载之前运行。

添加alert()调用会强制其余代码等待（直到您单击“确定”）;到发生的时候，jQuery将会加载。

相反，您可以使用<script>发出新的document.write()代码，以便同步加载它。

或者，您可以将其余代码包装在回调中，并在jQuery加载后调用回调。
如果你这样做，你应该使用一个脚本加载器库，它将为你处理所有这些。

在CDN关闭时加载jQuery的备份副本

2 个答案: