javascript - 如果未加载纯 Javascript 和回退，则检测并附加 jQuery

Question

有没有人知道一种方法来检测 jQuery 库是否已加载，如果没有附加它并在加载到 DOM 后启动脚本作为后备解决方案？

这是我的脚本:

if (typeof jQuery == 'undefined') {
    // if jQuery Library is not loaded
    var script = document.createElement( 'script' );
    script.type = 'text/javascript';
    script.src = 'http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js';
    document.body.appendChild(script);
    startScript();
} else {
    // cool, jQuery Library is loaded
    startScript();
}

function startScript() {
    $.noConflict();
    jQuery(document).ready(function($){
    .... // my jquery code
    });
}

当然，上面正确地附加了 jQuery 但没有做任何事情，因为脚本在附加后立即启动。有什么提示吗？

我很感激任何答案。谢谢!

Answer 1

除了如您所说，您不能在附加新的 script 元素后立即调用 startScript 之外没有问题。相反，执行一个 setTimeout 循环:

// ...
document.body.appendChild(script);
maybeStart();

maybeStart 看起来像这样(不在 if 的主体内，函数声明在那里无效):

function maybeStart() {
    if (typeof jQuery === "undefined") {
        setTimeout(maybeStart, 100);
    }
    else {
        startScript();
    }
}

检查是否加载了 jQuery，如果没有，等待十分之一秒并再次检查。当找到 jQuery 时，它会调用您的 startScript。

你可能想在那里设置一个时间限制(以防 jQuery 永远不会加载，所以你不会永远循环)。

或者，您可以在script 元素上挂接一个“加载”样式的事件，但它的机制因浏览器而异。在某些浏览器上，它只是 load ，例如 img 元素；在 IE(至少是旧版本)上，你必须使用 readystatechange，并且在某些版本的 IE 上两者都有效。所以你必须保留一个标志，这样你就知道你是否已经启动了你的脚本等等，并且......好吧，如果你知道脚本创建了一个众所周知的全局符号(如jQuery 就是这种情况)。