jQuery метод .addBack()

jQuery перемещения

Определение и применение

jQuery метод .addBack() позволяет добавить предыдущий набор элементов в стеке к текущему набору, при необходимости дополнительно отфильтрованный селектором.

Объекты jQuery поддерживают внутренний стек, который отслеживает изменения в сопоставленном наборе элементов. При вызове одного из методов обхода дерева DOM новый набор элементов помещается в стек. Если требуется предыдущий набор элементов метод .addBack() может помочь Вам в этом.

jQuery синтаксис:

Синтаксис 1.8:
$( selector ).addBack()
$( selector ).addBack( selector )

selector - Selector

Добавлен в версии jQuery

1.8

Значения параметров

ПараметрОписание
selectorСтрока, содержащая выражение селектора для сопостовления элементам. Параметр выступает в роли дополнительного фильтра (если элемент соответствует селектору, то он будет добавлен в коллекцию в обратном случае нет).

Пример использования

<!DOCTYPE html>
<html>
	<head>
		<title>Использование метода .addBack()</title>
		<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
		<script>
	$( document ).ready(function(){
	  $( ".second" ).nextAll() // получаем все элементы, которые являются следующими сестринскими элементами по отношению к текущему элементу
	                .css( "color", "green" ) // устанавливаем цвет текста зеленый
	                .addBack() // добавляем предыдущий набор элементов в стеке к текущему набору
	                .css( "border-left", "10px solid red" ); // устанавливаем сплошную границу размером 10 пикселей красного цвета с левой стороны 
		
	  $( ".first" ).nextUntil( ".active" ) // получаем все элементы, которые являются следующими сестринскими элементами по отношению к текущему элементу в наборе соответствующих элементов, но до и не включая элемента соответствующего классу active
	               .css( "color", "green" ) // устанавливаем цвет текста зеленый
	               .addBack( ".active" ) // добавляем предыдущий набор элементов в стеке к текущему набору в том случае, если элемент имеет класс active
	               .css( "border-left", "10px solid red" ); // устанавливаем сплошную границу размером 10 пикселей красного цвета с левой стороны 
	});
		</script>
	</head>
	<body>
		<ul>
			<li>Элемент 1</li>
			<li class = "second">Элемент 2</li>
			<li>Элемент 3</li>
			<li>Элемент 4</li>
		</ul>
		<ul>
			<li class = "first active">Элемент 1</li>
			<li>Элемент 2</li>
			<li>Элемент 3</li>
			<li>Элемент 4</li>
			<li class = "active">Элемент 5</li>
			<li>Элемент 6</li>
		</ul>
	</body>
</html>

В этом примере мы создали два маркированных списка (элементы <ul>):

Результат нашего примера:

Пример использования метода .addBack()
Пример использования метода .addBack()
jQuery перемещения