jQuery Traversing - Siblings
С помощью jQuery вы можете перемещаться по боком в DOM-дереве, чтобы находить родственные элементы элемента.
Братья и сестры имеют одного родителя.
Обход боком в дереве DOM
Существует много полезных методов jQuery для обхода боком в DOM-дереве:
- siblings()
- next()
- nextAll()
- nextUntil()
- prev()
- prevAll()
- prevUntil()
метод братьев и сестер jQuery ()
Метод братьев и сестер () возвращает все родственные элементы выбранного элемента.
В следующем примере возвращаются все родственные элементы <H2>:
Пример
$(document).ready(function(){
$("h2").siblings();
});
Можно также использовать необязательный параметр для фильтрации поиска для братьев и сестер.
В следующем примере возвращаются все родственные элементы <H2>, которые являются <p> элементами:
Пример
$(document).ready(function(){
$("h2").siblings("p");
});
Метод jQuery Next ()
Метод Next () возвращает следующий родственный элемент выбранного элемента.
В следующем примере возвращается следующий одноуровневый элемент < H2 >:
Пример
$(document).ready(function(){
$("h2").next();
});
Метод jQuery nextAll ()
Метод nextAll () возвращает все соседние элементы выбранного элемента.
В следующем примере возвращаются все элементы следующего элемента <H2>:
Пример
$(document).ready(function(){
$("h2").nextAll();
});
Метод jQuery nextUntil ()
Метод nextUntil () возвращает все соседние элементы одного уровня между двумя заданными аргументами.
В следующем примере возвращаются все родственные элементы между < H2 > и элементом < H6 >:
Пример
$(document).ready(function(){
$("h2").nextUntil("h6");
});
jQuery prev(), prevAll() & prevUntil() методы
The prev(), prevAll() и prevUntil() методы работают так же, как и методы, описанные выше, но с обратной функциональностью: они возвращают предыдущие родственные элементы (обход назад вдоль элементов в дереве DOM, а не вперед).
Справочник на обход jQuery
Для полного обзора всех методов обхода jQuery, пожалуйста, перейдите на наш справка на обход jQuery.