Comment charger dynamiquement des fichiers de script js à l'aide de jQuery_jquery

Ils sont puissants, mais parfois le gain l'emporte sur le gain. Si vous utilisez jQuery, il existe une méthode intégrée pour charger un seul fichier js. Vous pouvez utiliser cette méthode lorsque vous devez retarder le chargement de certains plug-ins js ou d'autres types de fichiers. Voici comment l'utiliser !

1. La méthode jQuery getScript() charge JavaScript

jQuery a une méthode intégrée pour charger un seul fichier js ; lorsque le chargement est terminé, vous pouvez effectuer des opérations ultérieures dans la fonction de rappel. La manière la plus simple d'utiliser jQuery.getScript est la suivante :

Copiez le code Le code est le suivant :

jQuery.getScript("/path/to/myscript.js", function(data, status, jqxhr) {

/*
Effectuer certaines choses qui doivent être exécutées une fois le chargement terminé
*/

});

Cette méthode getScript renvoie un jqxhr, vous pouvez l'utiliser comme ceci :

Copier le code Le code est le suivant :

jQuery.getScript("/path/to/myscript.js")
.done(function() {
/* Ouais, pas de problème, que peut-on faire ici*/
})
.fail(function() {
/* Merde, effectuez l'opération de sauvetage immédiatement*/
});

L'utilisation la plus courante de jQuery.getScript consiste à charger paresseux un plugin js et à l'exécuter une fois le chargement terminé :

Copier le code Le code est le suivant :

jQuery.getScript("jquery.cookie.js")
.done(function() {
jQuery.cookie("cookie_name", "valeur", { expire : 7 });
});

2. Problème de mise en cache

Il y a un problème très important. Lorsque vous utilisez jQuery.getScript, vous devez utiliser une chaîne d'horodatage après l'adresse js qui doit être chargée pour éviter qu'elle ne soit mise en cache. Cependant, si vous souhaitez que ce script soit mis en cache, vous devez définir la variable de cache globale, comme ceci :

Copier le code Le code est le suivant :

jQuery.ajaxSetup({
cache : vrai
});

Copier le code Le code est le suivant :

jQuery.ajax({
url : "jquery .cookie.js",
dataType : "script",
cache : true
}).done(function() {
jQuery.cookie("cookie_name", "value" , { expires : 7 });
});

Faites attention aux problèmes de mise en cache lors du chargement des scripts !