如何在 Greasemonkey 中嵌入额外的 jQuery 插件答案

【问题标题】：How to embed additional jQuery plugins into Greasemonkey如何在 Greasemonkey 中嵌入额外的 jQuery 插件
【发布时间】：2009-01-13 15:10:48
【问题描述】：

所以我已经能够让 Greasemonkey 和 jQuery 1.2.6 毫无问题地一起工作，但是，现在我想知道如何将其他 jQuery 插件嵌入到我的 Greasemonkey 脚本中，例如 Eric Martin 的 SimpleModal 插件 (@987654321 @)。

以下代码加载了 jQuery，但我不确定如何正确加载 SimpleModal：

    var GM_JQ = document.createElement('script');
    GM_JQ.src = 'http://jqueryjs.googlecode.com/files/jquery-1.2.6.min.js';
    GM_JQ.type = 'text/javascript';
    document.getElementsByTagName('head')[0].appendChild(GM_JQ);

    var GM_JQ_SM = document.createElement('script');
    GM_JQ_SM.src = 'http://simplemodal.googlecode.com/files/jquery.simplemodal-1.2.2.min.js';
    GM_JQ_SM.type = 'text/javascript';
    document.getElementsByTagName('head')[0].appendChild(GM_JQ_SM);

    // Check if jQuery's loaded
    function GM_wait() {
        if(typeof unsafeWindow.jQuery == 'undefined') { 
            window.setTimeout(GM_wait,100); 
        }
        else { 
            $ = unsafeWindow.jQuery; 
        }

    }
    GM_wait();

有人有什么想法吗？谢谢。

【问题讨论】：

标签： javascript jquery greasemonkey

【解决方案1】：

首先，如果您可以接受没有 Firebug 调试访问权限，那么包含 jquery 的最简单方法是使用 require 设置：

// @require        http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js
// @require        http://ajax.googleapis.com/ajax/libs/jqueryui/1.5.2/jquery-ui.min.js

在该行之后，您可以包含其他外部脚本。大多数jquery插件不像jquery api那样可用，但你可以自己托管。

使用 require 还可以让您转储所有加载代码并简单地使用：

$(document).ready( function() { ... });

Firebug 会报告错误，但您将无法进入调试器。

此外，一旦你加载了 jquery，你就可以加载其他项目来喜欢这样：

$('head').append("<link href='http://www.somewebsite.com/styles.css' type='text/css' rel='stylesheet'>");

【讨论】：

非常感谢罗基酱！效果很好，在我意识到我必须卸载/重新安装 Greasemonkey 脚本才能下载 jQuery 文件的本地副本之后。

【解决方案2】：

还可以查看 using JQuery in a GreaseMonkey script 和 @require block. 上的 GreaseMonkeyWiki 页面

【讨论】：