Pro jQuery

Pro jQuery

Адам Фриман

Изменение и возвращение к предыдущей выборке

jQuery сохраняет внутренний стек, если вы меняете выборку с использованием цепочки методов, и вы можете использовать это, применив пару методов, описанных в таблице 6-7.

Таблица 6-7: Методы для использования стека выборки
Метод Описание
end() Выводит текущую выборку из стека и возвращается к предыдущей выборке
andSelf() Добавляет предыдущую выборку к текущей выборке

Можно использовать метод end, чтобы вернуться к предыдущей выборке, что позволит выбрать некоторые элементы, расширить или сузить выборку, совершить некоторые операции, а потом вернуться к исходной выборке, как показано в листинге 6-9.

Листинг 6-9: Использование метода end
...
<script type="text/javascript">
	$(document).ready(function () {
		$('label').first().css("border", "thick solid blue")
			.end().css("font-size", "1.5em");
	});
</script>
...

В этом скрипте я начал с выборки всех элементов label в документе. Затем я сократил выборку, вызвав метод first (чтобы получить первый подходящий элемент), а потом установил значение для свойства border, используя метод css.

Потом я вызвал метод end, чтобы вернуться к предыдущей выборке (это возвращает нас от первого элемента label обратно ко всем элементам label), а затем я снова вызвал метод css, на этот раз чтобы указать значение для свойства font-size. Результат работы этого скрипта можно увидеть на рисунке 6-6.

Рисунок 6-6: Использование метода end

Метод andSelf добавляет содержание предыдущей выборки по стеку к текущей выборке. В листинге 6-10 показано использование метода addSelf.

Листинг 6-10: Использование метода addSelf
...
<script type="text/javascript">
	$(document).ready(function () {
		$('div.dcell').children('img')
			.andSelf().css("border", "thick solid blue");
	});
</script>
...

В этом примере я выбрал все элементы div, которые являются членами класса dcell, а потом использовал метод children, чтобы выбрать все элементы img, являющимися их дочерними элементами (о методе children я расскажу подробно в разделе "Навигация по DOM" далее в этой главе). Затем я вызвал метод andSelf, который объединил предыдущую выборку (элемент div) и текущую выборку (элементы img) в одном объекте jQuery. И наконец, я вызвал метод css, чтобы установить рамку для выбранных элементов. Результат работы этого скрипта можно увидеть на рисунке 6-7.

Рисунок 6-7: Использование метода andSelf
или RSS канал: Что новенького на smarly.net