jQuery utilise le symbole $ comme raccourci pour jQuery.
Et si d'autres frameworks JavaScript utilisaient également le symbole $ comme raccourci ?
Certains autres frameworks JavaScript incluent : MooTools, Backbone, Sammy, Cappuccino, Knockout, JavaScript MVC, Google Web Toolkit, Google Closure, Ember, Batman et Ext JS.
Certains de ces frameworks utilisent également le symbole $ comme raccourci (tout comme jQuery). Si vous utilisez deux frameworks différents qui utilisent le même symbole raccourci, cela peut entraîner l'arrêt du script.
L'équipe jQuery a pris en compte ce problème et a implémenté la méthode noConflict().
Le rôle de noConflict()
noConflict() n'existe que dans un seul but : il permet de charger plusieurs instances jQuery sur la même page, notamment Différentes versions de jQuery. Vous vous demandez peut-être pourquoi avez-vous besoin de charger/utiliser plusieurs versions différentes d'objets jQuery sur une seule page ? De manière générale, il existe deux situations. Dans le premier cas, votre code métier utilise la dernière version de la bibliothèque jQuery et le plug-in tiers que vous choisissez s'appuie sur une version antérieure de la bibliothèque jQuery ; dans le second cas, vous gérez un système qui dispose déjà de cette version. business Pour diverses raisons, le code fait référence à une ancienne version de la bibliothèque jQuery et votre module nouvellement développé utilise d'autres versions de la bibliothèque jQuery. Dans les deux cas, vous devez faire face au problème des conflits objet/méthode jQuery. Heureusement, jQuery.noConflict() vous aide à résoudre ce problème.
Méthode jQuery noConflict() La méthode
noConflict() libère le contrôle de l'identifiant $ afin que d'autres scripts puissent l'utiliser.
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script> <script> $.noConflict(); jQuery(document).ready(function(){ jQuery("button").click(function(){ jQuery("p").text("jQuery在工作!"); }); }); </script> </head> <body> <p>看我的变化</p> <button>点我</button> </body> </html>
Utilisez jQuery en remplaçant l'abréviation par le nom complet.
Vous pouvez créer votre propre abréviation :
var jq = $.noConflict(); jq(document).ready(function(){ jq("button").click(function(){ jq("p").text("jQuery 仍然在工作!"); }); });
Si votre bloc de code jQuery utilise le raccourci $ et que vous ne souhaitez pas modifier ce raccourci, vous pouvez transmettre le symbole $ en tant que variable à la méthode ready. De cette façon, vous pouvez utiliser le symbole $ à l'intérieur de la fonction - mais en dehors de la fonction, vous devez toujours utiliser "jQuery" :
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script> <script> $.noConflict(); jQuery(document).ready(function($){ $("button").click(function(){ $("p").text("这是覆盖的文字"); }); }); </script> </head> <body> <p>这是一段文字</p> <button>点击显示</button> </body> </html>