Dans Jquery, $ est un alias de JQuery. Tous les endroits où $ est utilisé peuvent également être remplacés par JQuery. Par exemple, $('#msg') est équivalent à JQuery('#msg'). Cependant, lorsque nous introduisons plusieurs bibliothèques js et que le symbole $ est également défini dans une autre bibliothèque js, il y aura alors un conflit lorsque nous utiliserons le symbole $. Ce qui suit est un exemple d'introduction de deux fichiers de bibliothèque jquery.js et prototype.js.
Le premier cas : jquery.js est introduit après prototype.js, tel que :
Dans ce cas, nous écrivons ce qui suit dans notre code js :
$('#msg').hide();
Le deuxième cas : jquery.js est introduit avant prototype.js, tel que :
<script src="jquery.js" type="text/javascript"/> <script src="prototype.js" type="text/javascript"/>
$('#msg').hide();
Ce qui suit présentera d'abord comment utiliser correctement le symbole $ défini dans différentes bibliothèques js dans le premier cas d'introduction des fichiers de bibliothèque js.
1. Utilisez JQuery.noConflict()
La fonction de cette méthode est de permettre à Jquery de renoncer à la propriété de $ et de rendre le contrôle de $ à prototype.js. Parce que jquery.js a été introduit plus tard, c'est jquery qui a finalement le contrôle de $. Sa valeur de retour est JQuery. Après avoir appelé cette méthode dans le code, nous ne pouvons pas utiliser $ pour appeler la méthode jquery. Pour le moment, $ représente le $ défini dans la bibliothèque prototype.js. Comme suit :
A partir de là, $ représente le $ défini dans prototype.js. Le $ dans jquery.js ne peut plus être utilisé. Vous ne pouvez utiliser que le nom complet de $ dans jquery.js, JQuery.
Après avoir défini jQuery en mode sans conflit, vous pouvez définir un alias pour $ :
<script src="prototype.js"></script> <script src="jquery.js"></script> <script>var $j = jQuery.noConflict();</script>
<script src="prototype.js"></script> <script src="jquery.js"></script> <script> jQuery.noConflict(); (function($) { // 这里依然可以继续使用 jQuery 的 $ })(jQuery); </script>
2. Personnaliser l'alias JQuery
Si vous trouvez difficile d'utiliser uniquement le nom complet de JQuery après avoir utilisé la méthode JQuery.noConflict() dans la première méthode, nous pouvons également redéfinir l'alias de JQuery. Comme suit :
var $j=JQuery.noConflict(); $j('#msg').hide();//此处$j就代表JQuery
3. Utilisez des blocs d'instructions, utilisez toujours le $ défini dans jquery.js dans le bloc d'instructions, comme suit :
JQuery.noConflict(); JQuery(document).ready(function($){ $('#msg').hide(); //此时在整个ready事件的方法中使用的$都是jquery.js中定义的$. });
(function($){ ..... $('#msg').hide();//此时在这个语句块中使用的都是jquery.js中定义的$. })(JQuery)
<script src="jquery.js" type="text/javascript"/> <script src="prototype.js" type="text/javascript"/> <script type="text/javascript"> (function($){ ..... $('#msg').hide();//此时在这个语句块中使用的都是jquery.js中定义的$. })(JQuery) </script>
Code
<script src="jquery.js" type="text/javascript"/> <script src="prototype.js" type="text/javascript"/> <script type="text/javascript"> (function($){ ..... $('#msg').hide(); //此时在这个语句块中使用的都是jquery.js中定义的$. })(JQuery) </script>