Конфликты JS библиотек

Как избежать конфликтов, используя несколько JavaScript-библиотек?

Конфликты библиотек

Переменная $ стала ключевой переменной для многих JS-библиотек. Используют ее и два «титана»: jQuery и Mootools. Mootools ведет более жесткую политику и отдавать «$» никак не хочет. В результате этого возникает ряд ошибок и обе библиотеки отказываются работать.

Выручает jQuery. В ней же есть несколько способов избежать конфликтов. Рассмотрим эти способы подробно.

1 способ

После подключения библиотеки jQuery пишем следующий код:

jQuery.noConflict();

После этого подключаем остальные библиотеки Но теперь уже jQuery использует не «$», а переменную «jQuery»

2 способ

var $COTONTI = jQuery.noConflict(true);

Теперь мы используем не “$”, а переменную «$COTONTI»

3 способ

jQuery(function($) { /* любой ваш код $ */ });

Практическое применение и выводы

  1. Я не могу сказать, что это хороший выход из положения. Мы обычно подключаем вторую библиотеку на сайт тогда, когда видим готовое решение для другой библиотеки, а в ответ получаем снижение скорости работы сайта, увеличение времени загрузки страницы. Но, поверьте, библиотеки равнозначны и если что-то уже реализовано для одной, значит и для второй уже есть вариант решения, просто надо хорошо поискать.
  2. В CMF Cotonti по умолчанию используется библиотека jQuery, и если использовать пути решения конфликтов, то придется перелопатить все файлы, где используется данная библиотека и вручную переименовать переменную «$».

Так что используйте данные способы рационально!

Заинтересовались? Звоните нам по телефонам +375 (29) 774-35-89 и +375 (44) 774-35-89 в Минске. Мы будем рады помочь Вам в реализации Вашего проекта.

1 комментарий к посту «Конфликты JS библиотек»
  • Аватар

    1. Сергей @ 4 янв 2017 г. в 01:50

      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>    <script src="<?=$h?>galleria-1.2.2.js"></script>    <script type="text/javascript" src="<?=$h?>js/jquery-1.8.0.min.js"></script>

           <script type="text/javascript">$.noConflict();</script>

    Подскажите как решить конфликт двух библиотек, нужны обе.

Новый комментарий

Для редактирования комментария осталось 10 минут