Comment puis-je utiliser jQuery dans Greasemonkey?

234

J'ai essayé de mettre cette ligne mais cela ne fonctionne pas:

// @require       http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.js

jQuery ne fonctionne pas du tout dans Greasemonkey. Existe-t-il un autre moyen d'utiliser jQuery dans Greasemonkey?

-

Pour toutes les personnes qui ont le même problème, vous devez télécharger le fichier sur greasespot puis l'installer à partir de là.

L'option Créer un nouveau script ne fonctionnerait pas!

Keira Nighly
la source
14
@Jorge, ne saviez-vous pas que ce site Web n'avait absolument rien de magique? Vous pouvez rechercher n'importe quoi avec une extension de fichier .user.js, et Greasemonkey vous demandera si vous souhaitez l'installer. Cela inclut les fichiers sur votre ordinateur local. L'installation d'un script est aussi simple que de le faire glisser sur votre navigateur.
Rob Kennedy
5
Il semble que cela fonctionne maintenant même lors de la modification du fichier après l'installation.
Josef Sábl
6
Josef a raison - depuis la version 0.9.0 , Greasemonkey installera désormais les fichiers @required dès que le fichier sera édité.
Rory O'Kane
1
N'oubliez pas non plus de continuer à utiliser $(document).ready(function() {...});dans votre code
Utilisateur
1
La façon la plus simple de vous rafraîchir @requiresest d'ajouter un hachage ou une chaîne de requête à la fin de l' @requireinstruction et de la modifier chaque fois qu'elle a besoin d'être mise à jour. Similaire à la façon dont vous «cachez» un favicon. // @require http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.js?v=changeme
Apache

Réponses:

189

Peut-être n'avez-vous pas une version assez récente de Greasemonkey. C'est la version 0.8 qui a été ajoutée @require.

// @require https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js 

Si vous n'avez pas 0.8, utilisez la technique décrite par Joan Piedra pour ajouter manuellement un scriptélément à la page .

Entre la version 0.8 et 0.9, @require n'est traité que lors de la première installation du script. Si vous modifiez la liste des scripts requis, vous devez désinstaller votre script et le réinstaller; Greasemonkey télécharge le script requis une fois lors de l'installation et utilise une copie en cache par la suite.

Depuis la version 0.9, le comportement de Greasemonkey a changé (pour résoudre un problème lié de manière tangentielle ) de sorte qu'il charge désormais les scripts requis après chaque modification; la réinstallation du script n'est plus nécessaire.

Rob Kennedy
la source
Rob, alors que dois-je faire? Je crée mes scripts utilisateur à l'aide du lien Nouveau script utilisateur. J'ajoute le @require et cela n'a pas fonctionné. Alors, comment puis-je le faire fonctionner? Veuillez expliquer que je veux que la méthode @require fonctionne car elle est beaucoup plus élégante que la méthode des éléments de script
Keira Nighly
1
Ok donc je l'ai fait fonctionner. Merci!!! J'ai téléchargé le script dans Greasespot et l'ai installé à partir de là.
Keira Nighly
2
J'imagine que lorsque vous créez un nouveau script à partir de Greasemonkey, le script est installé immédiatement. Ce script est le fichier vide par défaut, ce qui signifie que vous avez raté votre chance d'exiger des scripts externes.
Rob Kennedy
Il n'y a donc aucun moyen d'utiliser @require sur un nouveau script que vous créez? : /
quano
4
C'est assez simple, @Quano. Créez un nouveau fichier .user.js, écrivez-y votre script, puis faites-le glisser sur votre navigateur pour l'installer. La limitation de l'exigence de scripts externes n'est présente que si vous créez le script à partir de l'interface utilisateur de Greasemonkey, mais il n'est pas nécessaire d'utiliser Greasemonkey pour créer le fichier de script. Vous pouvez modifier le script après son installation, mais si vous souhaitez ajouter de nouvelles @requiredirectives, vous devrez désinstaller et réinstaller le script pour qu'il prenne effet.
Rob Kennedy
81

Si vous souhaitez utiliser jQuery sur un site où il est déjà inclus, voici le chemin à parcourir (inspiré par BrunoLM):

var $ = unsafeWindow.jQuery;

Je sais que ce n'était pas l'intention initiale de la question, mais cela devient de plus en plus un cas commun et vous n'avez pas explicitement exclu ce cas. ;)

Henrik Heimbuerger
la source
4
Non pris en charge dans Chrome apparemment - chromium.org/developers/design-documents/user-scripts
Ashley
Fonctionne en Scriptish de Firefox!
Gqqnbig
2
Voulez-vous tester que vous ne l'avez pas déjà comme ça: if(typeof $ == 'undefined'){ var $ = unsafeWindow.jQuery; } Dans Chrome, un site Jquery sera déjà disponible.
Jonathon
Hmm. Je reçois une erreur vraiment étrange lors de l'utilisation de cela. C'est à la alert($('.submit_entry').length);fois une erreur et l'envoi de l'alerte appropriée en même temps.
Jonathon
21

Il n'y a absolument rien de mal à inclure l'intégralité de jQuery dans votre script Greasemonkey. Prenez simplement la source et placez-la en haut de votre script utilisateur. Pas besoin de faire une balise de script, puisque vous exécutez déjà JavaScript!

L'utilisateur ne télécharge le script qu'une seule fois de toute façon, donc la taille du script n'est pas un gros problème. En outre, si vous souhaitez que votre script Greasemonkey fonctionne dans des environnements non GM (tels que les scripts utilisateur GM-esque d'Opera ou Greasekit sur Safari), cela vous aidera à ne pas utiliser des constructions uniques GM telles que @require.

Dan Lew
la source
7

La solution de Rob est la bonne - utilisez-la @requireavec la bibliothèque jQuery et assurez-vous de réinstaller votre script pour que la directive soit traitée.

Je pense qu'une chose mérite d'être ajoutée, c'est que vous pouvez utiliser jQuery normalement une fois que vous l'avez inclus dans votre script, à l' exception des méthodes AJAX . Par défaut, jQuery recherche XMLHttpRequest, qui n'existe pas dans le contexte Greasemonkey. J'ai écrit sur une solution de contournement dans laquelle vous créez un wrapper pour GM_xmlhttpRequest (la version Greasemonkey de XHR) et utilisez jQuery ajaxSetup()pour spécifier votre version encapsulée par défaut. Une fois que vous faites cela, vous pouvez utiliser $.getet $.postcomme d'habitude.

Vous pouvez également rencontrer des problèmes avec jQuery $.getJSONcar il charge JSONP à l'aide de <script>balises. Cela conduit à des erreurs car jQuery définit la fonction de rappel dans la portée de la fenêtre Greasemonkey et les scripts chargés recherchent le rappel dans la portée de la fenêtre principale. Votre meilleur pari est d'utiliser à la $.getplace et d'analyser le résultat avec JSON.parse().

Ryan
la source
4

Vous pouvez créer un nouveau script à l'aide du nouveau script utilisateur dans Greasemonkey mais vous devez modifier le fichier config.xml dans le dossier gm_scripts.

Votre fichier config.xml doit avoir une syntaxe similaire à celle-ci:

<Script filename="jquery_test.user.js" name="jQuery Test" namespace="http://www.example.com/jQueryPlay/" description="Just a test" enabled="true" basedir="jquery_test">
        <Include>http://*</Include>
        <Require filename="jquery.js"/>
</Script>

Remarquez la <Require>balise.

Dans votre script, vous pouvez utiliser la syntaxe jQuery directe. Assurez-vous d'avoir la balise require dans l'en-tête Greasemonkey. Voici un exemple de Hello World:

// ==UserScript==
// @name           Test jQuery
// @namespace      http://www.example.com/jQueryPlay/
// @description    Just a test
// @include        http://*
// @require       http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.js
// ==/UserScript==

$(document).ready(function() {  
        alert("Hello world!");
});

N'oubliez pas qu'après avoir modifié fichier config.xml, vous devez redémarrer votre navigateur pour que Greasemonkey recharge à nouveau les paramètres.

Notez également que vous devez copier le fichier jquery.js dans votre dossier de répertoire de script pour que cela fonctionne. J'ai testé cela, et cela ne fonctionne que si vous copiez le fichier manuellement là-bas.

Joyeux jQuerying!

Auspex
la source
4

Mettre à jour : comme le dit le commentaire ci-dessous, cette réponse est obsolète.

Comme tout le monde l'a dit, @require n'est exécuté que lorsque le script est installé. Cependant, vous devez également noter qu'actuellement jQuery 1.4. * Ne fonctionne pas avec greasemonkey. Vous pouvez voir ici pour plus de détails: http://forum.jquery.com/topic/importing-jquery-1-4-1-into-greasemonkey-scripts-generates-an-error

Vous devrez utiliser jQuery 1.3.2 jusqu'à ce que les choses changent.

Conley Owens
la source
3
Cette réponse est obsolète à partir de GM version 0.9 ou ultérieure.
Brock Adams
3
@Brock: Pourquoi? Pouvez-vous nous expliquer noobs?
Trevor Sullivan
1

Vous pourriez obtenir Component unavailablesi vous importez directement le script jQuery.

C'est peut-être de cela que parlait @Conley ...

Vous pouvez utiliser

@require        http://userscripts.org/scripts/source/85365.user.js

qui est une version modifiée pour fonctionner sur Greasemonkey, puis obtenir l'objet jQuery

var $ = unsafeWindow.jQuery;
$("div").css("display", "none");
BrunoLM
la source
Je me rends compte que c'est 5 ans, mais je me demande simplement: n'est-ce pas mal d'obtenir l'objet jQuery comme il était déjà défini sur la page, en se référant à unsafeWindow.jQuery?
jj_
0

@requiren'est PAS traité uniquement lors de la première installation du script! D'après mes observations, il est traité lors de la première exécution! Vous pouvez donc installer un script via la commande de Greasemonkey pour créer un tout nouveau script. La seule chose à laquelle vous devez faire attention est qu'il n'y a pas de rechargement de page déclenché, avant d'ajouter la @requirepartie. (et enregistrez le nouveau script ...)

Dunstkreis
la source