Question

我正在使用以下代码来确保在我的bookmarklet中执行javascript的主体之前已经在页面中加载了jQuery。这个代码是否有可能无法在任何浏览器中正确加载jQuery？

if (!window.jQuery) {
    var script = document.createElement("script");
    script.src = "//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js";
    script.onload = function () {
        foo();
    };
    document.head.appendChild(script);
} else {
    foo();
}

function foo() {
    // bookmarklet code goes here
}

Answer 1

这个代码是否有可能无法在任何浏览器中正确加载jQuery？

除非相关网页是从本地资源加载而不是通过http / https加载的。在这种情况下，协议相对URL将失败。

您可能希望颠倒设置src和onload属性的顺序;如果资源在缓存中，则可以在挂钩处理程序之前触发事件（浏览器中的JavaScript是除Web Worker之外的单线程，但 browsers 不是单线程的）。

此外，无需在foo附近包含其他功能：

if (!window.jQuery) {
    var script = document.createElement("script");
    script.onload = foo;
    script.src = "//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js";
    document.head.appendChild(script);
} else {
    foo();
}

function foo() {
    // bookmarklet code goes here
}

如果您想处理协议问题，那么它适用于file:网址等，这很容易做到：

if (!window.jQuery) {
    var protocol = location.protocol;
    if (protocol !== "http:" && protocol !== "https:") {
        protocol = "http:";
    }
    var script = document.createElement("script");
    script.onload = foo;
    script.src = protocol + "//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js";
    document.head.appendChild(script);
} else {
    foo();
}

function foo() {
    // bookmarklet code goes here
}

检查是否已在bookmarklet中加载jQuery

1 个答案: