Последние учебники веб-разработки
 

jQuery Пересекая - Братья и сестры

❮ Предыдущая Следующая Глава ❯

Братья и сестры имеют одного общего предка.

С помощью JQuery вы можете перемещаться боком в дерево DOM, чтобы найти братьев и сестер элемента.

Пересекая Боком в DOM дереве

Есть много полезных методов JQuery для обхода боком в дерево DOM:

  • siblings()
  • next()
  • nextAll()
  • nextUntil()
  • prev()
  • prevAll()
  • prevUntil()

JQuery siblings() и siblings() Метод

siblings() и siblings() метод возвращает все одноуровневые элементы выбранного элемента.

Следующий пример возвращает все одноуровневые элементы <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() Методы

prev(), prevAll() и prevUntil() методы работают так же , как выше , но с обратной функциональностью методами: они возвращают предыдущие элементы одноранговых (перемещение в обратном направлении вдоль двойников элементов в дереве DOM, а не вперед).

Проверьте себя с упражнениями!

Упражнение 1 » Упражнение 2» Упражнение 3 » Упражнение 4» Упражнение 5 » Упражнение 6»

Jquery Обход Ссылка

Полный обзор всех методов Jquery обходе, пожалуйста , перейдите на наш JQuery обходе Reference .


❮ Предыдущая Следующая Глава ❯