jQuery
Материал из Википедии — свободной энциклопедии
| jQuery | |
 |
|
| Тип | JavaScript-библиотека |
| Разработчик | Джон Ресиг |
| Написана на | JavaScript |
| ОС | Кроссплатформенное ПО |
| Версия | 1.3.2 — 20 февраля 2009 |
| Лицензия | MIT License и GNU GPL |
| Сайт | http://jquery.com/ |
jQuery — библиотека JavaScript, фокусирующаяся на взаимодействии JavaScript и HTML. Библиотека jQuery помогает легко получать доступ к любому элементу DOM, обращаться к атрибутам и содержимому элементов DOM, манипулировать ими. Также библиотека jQuery предоставляет удобный API по работе с Ajax.
Содержание |
[править] История создания
HTML была одной из первых вещей, которую Джон Ресиг узнал когда, он только начал заниматься программированием. Резиг делал QBasic, когда один его знакомый показал ему, как создать веб-страницу (используя Angelfire), а также основы HTML. Отец подарил ему на Рождество две книги по HTML. Именно тогда, когда он только начал программировать на Visual Basic, HTML и веб-дизайн очень заинтересовали его.
Но страсть к JavaScript пришла значительно позже, примерно в 2004 году. Тогда Резиг получал степень в области компьютерных наук и работал на полставки в местной фирме Brand Logic. Он занимался дизайном сайта, в котором создавался пользовательский скроллинг. Джон был разочарован и расстроен, особенно потому что, использовал код других разработчиков, после этого, решил серьезно изучить JavaScript. Изучив, пришел к выводам, что JavaScript — это простой, но изящный язык, который является невероятно мощным решением многих задач. Ближайшие пару лет Д.Резиг сделал много различных приложений JavaScript, прежде чем, закончил создание jQuery. Библиотека была представлена общественности на компьютерной конференции «BarCamp» в Нью-Йорке в 2006 году.
Резиг преследовал основную цель jQuery: закодировать многоразовые куски кода, которые позволят упростить JavaScript и использовать их, так чтобы, не беспокоиться о кросс-браузерных вопросах. Ночь в начале 2006 года Резиг запомнил на всю жизнь как счастливую: он закончил работу над jQuery и запустил его в Internet Explorer — все заработало. Это был успех!
[править] Возможности
- Переход по дереву DOM, включая поддержку XPath как плагина;
- события;
- визуальные эффекты;
- AJAX-дополнения;
- JavaScript-плагины.
[править] Философия
Точно так же, как CSS отделяет визуализацию от структуры HTML, JQuery отделяет поведение от структуры HTML. Например, вместо прямого указания на обработчик события нажатия кнопки, управление передаётся JQuery, идентифицирующей кнопки и затем преобразовывающий его в обработчик события клика. Такое разделение поведения и структуры также называется принципом ненавязчивого JavaScript.
Библиотека jQuery содержит функционал, полезный для максимально широкого круга задач. Тем не менее, разработчиками библиотеки не ставилась задача совмещения в jQuery функций, которые подошли бы всюду, поскольку это привело бы к большому коду, бо́льшая часть которого не востребована. Поэтому была реализована архитектура компактного универсального ядра библиотеки и плагинов[1]. Это позволяет собрать для ресурса именно тот JavaScript-функционал, который на нём был бы востребован.
[править] Использование
jQuery, как правило, включается в веб-страницу как один внешний JavaScript-файл:
<head> <script type="text/javascript" src="путь/к/jQuery.js"></script> </head>
Вся работа с jQuery ведётся с помощью функции $. Если на сайте применяются другие JavaScript библиотеки, где $ может использоваться для своих нужд, то можно использовать её синоним — jQuery. Второй способ считается более правильным, а чтобы код не получался слишком громоздким можно писать его следующим образом:
jQuery(function($) { // Тут код скрипта, где в $ будет jQuery })
Работу с jQuery можно разделить на 2 типа:
- Получение jQuery-объекта с помощью функции
$(). Например, передав в неё CSS-селектор, можно получить jQuery-объект всех элементов HTML попадающих под критерий и далее работать с ними с помощью различных методов jQuery-объекта. - Вызов глобальных методов у объекта
$, например, удобных итераторов по массиву.
Типичный пример манипуляции сразу несколькими узлами DOM заключается в вызове $ функции со строкой селектора CSS, что возвращает объект jQuery, содержащий некоторое количество элементов HTML-страницы. Эти элементы затем обрабатываются методами jQuery. Например,
$("div.test").add("p.quote").addClass("blue").slideDown("slow");
находит все элементы <div> с классом test, а также все элементы <p> с классом quote, и затем добавляет им всем класс blue и визуально плавно спускает вниз.
Методы, начинающиеся с $., удобно применять для обработки глобальных объектов. Например:
$.each([1,2,3], function() { document.write(this + 1); });
добавит на страницу 234.
$.ajax и соответствующие функции позволяют использовать методы AJAX. Например:
$.ajax({ type: "POST", url: "some.php", data: {name: 'John', location: 'Boston'}, success: function(msg){ alert( "Data Saved: " + msg ); } });
В этом примере идет обращение к скрипту some.php с параметрами name=John&location=Boston и полученный результат выдается в сообщении по средством alert().
Пример добавления к элементу обработчика события click с помощью jQuery:
$(document).ready(function() { $("a").click(function() { alert("Hello world!"); }); });
В данном случае при нажатии на элемент <A> происходит вызов alert("Hello world!").
[править] История версий
| Версия | Ссылки | Дата релиза | Существенные изменения |
|---|---|---|---|
| 1.0 | — | 30 июня 2006 | Первая альфа-версия |
| 1.0 | сж. | 26 августа 2006 | Первая стабильная версия |
| 1.0.1 | сж., несж. | 31 августа 2006 | Первая версия с исправлениями ошибок |
| 1.0.2 | сж., несж. | 9 октября 2006 | Изменение интерфейса прикладного программирования |
| 1.0.3 | сж., несж. | 27 октября 2006 | — |
| 1.0.4 | сж., несж. | 12 декабря 2006 | — |
| 1.1a | — | 8 января 2007 | Альфа-версия |
| 1.1b | — | 11 января 2007 | Бета-версия |
| 1.1 | сж., несж. | 14 января 2007 | — |
| 1.1.1 | сж., несж. | 22 января 2007 | — |
| 1.1.2 | сж., несж. | 27 февраля 2007 | — |
| 1.1.3a | — | 20 мая 2007 | Альфа-версия |
| 1.1.3 | сж., несж. | 1 июля 2007 | Более чем в 8 раз увеличено быстродействие при размере в 20 кб[2] |
| 1.1.3.1 | сж., несж. | 5 июля 2007 | — |
| 1.1.4 | сж., несж. | 24 августа 2007 | — |
| 1.2 | мин., сж., несж. | 10 сентября 2007 | — |
| 1.2.1 | мин., сж., несж. | 16 сентября 2007 | — |
| 1.2.2 | мин., сж., несж. | 15 января 2008 | — |
| 1.2.3 | мин., сж., несж. | 8 февраля 2008 | — |
| 1.2.4 | мин., сж., несж. | 19 мая 2008 | — |
| 1.2.5 | мин., сж., несж. | 21 мая 2008 | — |
| 1.2.6 | мин., сж., несж., в.док. | 24 мая 2008 | — |
| 1.3 | мин., несж., в.док. | 14 января 2009 | метод live() |
| 1.3.1 | мин., несж., в.док. | 21 января 2009 | — |
| 1.3.2 | мин., несж., в.док. | 20 февраля 2009 | — |
| Легенда | |||
|---|---|---|---|
| мин. — минифицировано | сж. — сжато | несж. — не сжато | в.док — документация Visual Studio |
[править] Метод live()
Плагин Live Query использует возможности селекторов jQuery для связывания событий или вызова функций-обработчиков для выбранных элементов автоматически, при обновлении дерева DOM. Подключив плагин к странице <script type="text/javascript" src="js/jquery-1.2.6.js"></script> <script type="text/javascript" src="js/jquery.livequery.js"></script> мы можем использовать всю его функциональность. Теперь, чтобы автоматически связывать событие click с любым элементом (пусть для примера это будет параграф p), который есть или появится в будущем в объектной модели документа, достаточно написать такой код:
$("p").livequery("click", function() {
alert($(this).text());
});
Клик по параграфу приведет к тому, что в alert’е будет выведен текст, содержащийся в этом параграфе. livequery(type, fn) — связывает обработчик события, определенный в параметре fn, с событием, указанным в параметре type. В этом параметре можно указать любое событие jQuery. Функция-обработчик будет вызвана для каждого элемента набора, к которому применен метод livequery. Любой элемент, если он при появлении в DOM будет соответствовать тому селектору jQuery, с помощью которого создавался набор, автоматически будет связан с существующим обработчиком события. Как только элемент перестает соответствовать селектору — он потеряет и обработчик.
[править] Интеграция с другими продуктами
28 сентября 2008 года на официальном блоге JQuery[3] сообщили о том, что компании Microsoft и Nokia собираются сотрудничать с группой разработчиков. Компания Microsoft собирается интегрировать в свой продукт Asp.NET листинги кода и примеры JQuery, а компания Nokia собирается интегрировать JQuery для своих мобильных виджетов.
[править] Команда разработчиков
Работа над библиотекой разделена на 5 групп:
| Команды | Описание | Участники |
|---|---|---|
| Разработка | Несет ответственность за содержание библиотеки (разработка, тестирование, документирование и т. д.). |
|
| Евангелист | Ответственный за связь с общественностью. |
|
| jQuery UI | Разработка и поддержка jQuery UI.[4] |
|
| Plugins | Люди ответственные за разработку плагинов |
|
| Web дизайнеры | Ответственные за дизайн и поддержку сайта jQuery.[6] |
|
[править] См. также
[править] Примечания
- ↑ Бер Бибо, Иегуда Кац. 1.3.5 Расширение jQuery // jQuery. Подробное руководство по продвинутому JavaScript = jQuery in Action. — Спб.: Символ-Плюс, 2009. — 384 с. — 2000 экз. — ISBN 978-5-93286-135-6, 5-93286-135-5, 1-933988-35-5
- ↑ Запись в блоге jQuery о релизе 1.1.3
- ↑ Официальный блог jQuery.
- ↑ Официальная страница jQuery UI. Проверено 3 июня 2009.
- ↑ Полный список контрибьюторов jQuery UI. Проверено 3 июня 2009.
- ↑ Официальная страница jQuery. Проверено 3 июня 2009.
[править] Ссылки
- Официальный сайт (англ.)
- Структурированная on-line документация по JQuery (англ.)
- Репозиторий jQuery плагинов (англ.)
- jQuery User Interface library (англ.)
- jQuery для JavaScript-программистов — перевод статьи «jQuery for JavaScript programmers».
- jQuery — Javascript нового поколения — статья, описывающая практически все аспекты использования jQuery.
- jQuery для начинающих — перевод статьи «jQuery Tutorials for Designers».
- Русская документация по jQuery — Перевод официальной документации jQuery на русский язык.
 |
Эта статья выставлена на рецензию. Пожалуйста, выскажите своё мнение о ней на странице Википедия:Статьи для рецензирования. |
