Плагин — это фрагмент кода, написанный в стандартном файле JavaScript. Эти файлы предоставляют полезные методы jQuery, которые можно использовать вместе с методами библиотеки jQuery.
Существует множество плагинов jQuery, которые вы можете скачать по ссылке на репозиторий на https://jquery.com/plugins .
Как использовать плагины
Чтобы сделать методы плагина доступными для нас, мы включаем файл плагина, очень похожий на файл библиотеки jQuery, в <head> документа.
Мы должны убедиться, что он появляется после основного исходного файла jQuery и перед нашим пользовательским кодом JavaScript.
В следующем примере показано, как включить плагин jquery.plug-in.js.
<html> <head> <title>The jQuery Example</title> <script type = "text/javascript" src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"> </script> <script src = "jquery.plug-in.js" type = "text/javascript"></script> <script src = "custom.js" type = "text/javascript"></script> <script type = "text/javascript" language = "javascript"> $(document).ready(function() { .......your custom code..... }); </script> </head> <body> ............................. </body> </html>
Как разработать плагин
Это очень просто написать свой собственный плагин. Ниже приведен синтаксис для создания метода —
jQuery.fn.methodName = methodDefinition;
Здесь methodNameM — это имя нового метода, а methodDefinition — фактическое определение метода.
Руководство, рекомендованное командой jQuery, выглядит следующим образом:
-
Любые методы или функции, которые вы присоединяете, должны иметь точку с запятой (;) в конце.
-
Ваш метод должен возвращать объект jQuery, если в явном виде не указано иное.
-
Вы должны использовать this.each для итерации по текущему набору совпадающих элементов — таким образом получается чистый и совместимый код.
-
Префикс имени файла с jquery, затем с именем плагина и в заключение с .js.
-
Всегда подключайте плагин к jQuery напрямую, а не к $, чтобы пользователи могли использовать собственный псевдоним с помощью метода noConflict ().
Любые методы или функции, которые вы присоединяете, должны иметь точку с запятой (;) в конце.
Ваш метод должен возвращать объект jQuery, если в явном виде не указано иное.
Вы должны использовать this.each для итерации по текущему набору совпадающих элементов — таким образом получается чистый и совместимый код.
Префикс имени файла с jquery, затем с именем плагина и в заключение с .js.
Всегда подключайте плагин к jQuery напрямую, а не к $, чтобы пользователи могли использовать собственный псевдоним с помощью метода noConflict ().
Например, если мы напишем плагин, который мы хотим назвать отладочным , наше имя файла JavaScript для этого плагина —
jquery.debug.js
Использование JQuery. Префикс исключает любые возможные конфликты имен с файлами, предназначенными для использования с другими библиотеками.
пример
Ниже приведен небольшой плагин, в котором есть метод предупреждения для целей отладки. Сохраните этот код в файле jquery.debug.js —
jQuery.fn.warning = function() { return this.each(function() { alert('Tag Name:"' + $(this).prop("tagName") + '".'); }); };
Вот пример, показывающий использование метода warning (). Предполагая, что мы поместили файл jquery.debug.js в тот же каталог html-страницы.
<html> <head> <title>The jQuery Example</title> <script type = "text/javascript" src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"> </script> <script src = "jquery.debug.js" type = "text/javascript"> </script> <script type = "text/javascript" language = "javascript"> $(document).ready(function() { $("div").warning(); $("p").warning(); }); </script> </head> <body> <p>This is paragraph</p> <div>This is division</div> </body> </html>
Это предупредит вас со следующим результатом —