[javascript]jQuery 다른 라이브러리, 다른 버전의 jQuery와 충돌 방지하기

jQuery를 사용할 때 다른 라이브러리와 충돌이 나는 경우가 있습니다.

 

충돌의 원인은 두가지로 구분할 수 있습니다.

 

다른 라이브러리와 충돌

 

다른 버전의 jQuery와 충돌

 

각 경우에 대해서 어떻게 충돌을 방지할 수 있는지 알아보겠습니다.

 

다른 라이브러리와 충돌

 

jQuery는 $를 jQuery의 alias로 사용합니다.

 

그런데 다른 라이브러리에서 $를 함수나 변수로 사용한다면 jQuery가 제대로 작동하지 않을 수 있습니다.

 

이를 방지하는 방법은 jQuery에서 $를 alias로 사용하지 않도록 하는 것입니다.

 

$.noConflict();

 

또는

 

jQuery.noConflict();

 

를 넣으면 $를 다른 라이브러리가 사용하고, jQuery 코드를 만들 때는 $ 대신 jQuery를 사용합니다.

 

만약 계속해서 $를 사용하고 싶다면 다음과 같이 합니다.

 

$.noConflict();  jQuery( document ).ready(function( $ )  {      // AAA });      // BBB AAA에서는 jQuery가 $를 사용하고, BBB에서는 다른 라이브러리가 $를 사용합니다.

 

 

jQuery의 alias를 다른 것으로 만드는 방법도 있습니다.

 

var jb = jQuery.noConflict();  위와 같이 하면 $ 대신 jb를 jQuery의 alias로 사용합니다.  jb( 'p' ).addClass( 'abc' );

 

 

다른 버전의 jQuery와 충돌

 

흔한 경우는 아니지만 여러 버전의 jQuery를 사용하는 경우가 있습니다.  이런 경우 충돌을 방지하는 방법은 버전별로 alias를 따로 만들어 주는 것입니다.  <script src='jquery-1.11.1.js'></script>  <script>    var jb = jQuery.noConflict();  </script>  <script src='jquery-2.1.1.js'></script>  <script>    var hs = jQuery.noConflict();  </script>  1.11.1을 사용할 때는 jb를, 2.1.1을 사용할 때는 hs를 alias로 사용합니다.

 

 

원문출처 : https://www.cmsfactory.net/node/10494