Отбор всех родительских элементов

Метод: .parents();

• Задача 1:

  - обвести красной рамкой (#cc0000) все элементы, которые являются родительским для элемента li.

  Показать решение

  • Решение:

    $(function () {
    	$('li').parents().css('border', '1px solid #cc0000');
    });
    

    Пояснение:

    - Для решения задачи с помощью селектора $('li') выберем элементы списка. С помощью метода .parents() находим и обводим красной рамкой элементы, которые являются родителями для элементов li.

    Результат:

    При загрузке страницы, к которой подключен скрипт, элементы, которые являются родителями для элементов li будут обведены красной рамкой (включая элементы body и html).

• Задача 2:

  - обвести красной рамкой (#cc0000) только div элементы, которые являются родительским для элемента li.

  Показать решение

  • Решение:

    $(function () {
    	$('li').parents('div').css('border', '1px solid #cc0000');
    });
    

    Пояснение:

    - Для решения задачи с помощью селектора $('li') выберем элементы li. С помощью метода .parents('div') находим и обводим красной рамкой только элементы div, которые являются родительскими для элементов li. Следует обратить внимание, что элемент ul, который является ближайшим родителем в набор включен так же не будет.

    Результат:

    При загрузке страницы, к которой подключен скрипт, все элементы div, которые являются родительскими элементами для li, будут обведены красной рамкой.