Приднестровская поддержка XOOPS
Обычно большинство действий производится над элементами HTML-документа. По этой причине выполнять скрипты необходимо только после полной загрузки документа. Без библиотеки jQuery для этой цели обычно используется событие onload объекта window.
window.onload = function() {
alert("Документ полностью загружен");
}
Однако это событие возникает только после полной загрузки самого HTML-документа, а также всех других элементов, например изображений. Загрузка изображений (или баннеров с другого домена) может занимать определенное время, в течение которого выполнение скриптов как бы подвисает. Библиотека jQuery избавляет нас от потери времени и предоставляет возможность выполнения скриптов сразу после формирования структуры документа, не дожидаясь загрузки других элементов. Обработать это событие можно с помощью метода ready().
jQuery(document).ready(function() {
alert("Документ доступен для выполнения скриптов");
});
Функция jQuery() имеет псевдоним $(). Используя этот псевдоним, можно обработать событие следующим образом.
$(document).ready(function() {
alert("Документ доступен для выполнения скриптов");
});
Если в качестве параметра функции jQuery() указать ссылку на функцию, то она также будет выполнена сразу после формирования структуры документа.
jQuery(function() {
alert("Документ доступен для выполнения скриптов");
});
Этот код можно еще сократить.
$(function() {
alert("Документ доступен для выполнения скриптов");
});
Необходимо также заметить, что в программе может быть несколько вызовов методов ready(). В этом случае выполнение методов происходит в порядке их объявления внутри программы.
Рассмотрим последовательность событий на примере. Для этого создадим HTML-документ и объявим несколько методов ready(), а также обработаем событие onload (листинг 1.1).
Листинг 1.1. Последовательность обработки событий
<html>
<head>
<title>Последовательность обработки событий</title>
<meta http-equiv="Content-Type" content="text/html;
charset=utf-8">
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">
window.onload = function() {
alert("Событие onload");
}
$(document).ready(function() {
alert("Метод ready(). Вызов 1");
});
$(document).ready(function() {
alert("Метод ready(). Вызов 2");
});
$(function() {
alert("Вызов функции $()");
});
</script>
</head>
<body>
Пример последовательности обработки событий
</body>
</html>
При выполнении этого примера будет иметь место следующая последовательность событий.
Метод ready(). Вызов 1
Метод ready(). Вызов 2
Вызов функции $()
Событие onload
Как видно из примера, событие onload возникает самым последним, а методы ready () и функция $ () выполняются в порядке их объявления в программе.
Отправитель | Нити |
---|
5 пользователь(ей) активно (2 пользователь(ей) просматривают Инструкции)
Участников: 0 Гостей: 5 далее... |