Базовая функция jQuery ()

Операции обхода и преобразования объектной модели документа обычно начинаются с поиска необходимых элементов. В обычном JavaScript для выбора элемента используются, например, функции getEIementsByTagName или getElementByld. В jQuery для этой цели функция jQuery () (краткая запись $()), синтаксис которой является комбинацией CSS и регулярных выражений:

jQuery (expression, [context]) или $(expression, [context]).

Данная функция принимает в качестве первого параметра строку expression, содержащую поисковое выражение (CSS-селектор). Второй параметр функции context (необязательный) — это элементы DOM, объекты document или объекты jQuery, которые задают область поиска (контекст поиска). Функция jQuery () возвращает специальный объект JavaScript, который содержит массив элементов DOM-модели, соответствующих указанному в параметре запросу (селектору).

Например, для получения элемента с идентификатором #myElement нужно записать.

jQuery (''#myElement") или $(«#myElement»).

Объект jQuery (набор элементов) имеет большое количество методов, которые воздействуют на каждый элемент этого набора. В частности, к ним можно добавлять обработчики событий. Например, чтобы вывести сообщение после нажатия на кнопку, можно разместить JavaScript в событии onclick:

" button id="myButton" onclick="alert ('l was clicked!')" > Click me!

Недостатком этого подхода является то, что он смешивает код с разметкой, что может усложнить поддержку приложения и его логику. Используя jQuery, можно добавить внешний обработчик событий для нажатия кнопки.

" button id="myButton" >Click me!

" script type="text/javascript">

$('button#myButton').click (function () {alert ('l was clicked!');});

За счет такого разделения разметки сайта и его кода (поведения) облегчается поддержка сайта, улучшается читаемость кода.

Аналогичным способом можно добавить обработчик для события ready к целой странице. Он запустится после того, как сформируется иерархия объектов DOM для страницы. Таким образом, лучше всего, если события и другой jQuery-код будут содержаться в обработчике события ready:

$(document).ready (function () {.

$('button#myButton').click (function () {alert ('Button was clicked!');});

}):

В результате получается то же самое, что и в предыдущем примере, но более безопасным способом, в котором вначале загружается DOM, и только затем к кнопке прикрепляется обработчик событий.

-запросы

С помощью jQuery очень просто создавать Ajax запросы. Например, ниже показан Ajax-запрос, выполняемый в ответ на нажатие кнопки (аналогичный рассмотренному ранее в разделе «Технология Ajax»): «script type="text/javascript''>

$(document).ready (function () {$(«button'').click (function () {.

$(«#otvet'').load ("request.txt»);});

});

Обработчики Ajax-запросов очень просто писать с использованием технологий РНР и ASP.Net МУС.