Выбор предыдущего элемента

Метод: .prev();

• Задача 1:

  - обвести красной рамкой (#cc0000) элемент, который следуют сразу же перед элементом span, расположенном в блоке с классом first.

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

  • Решение:

    $(function () {
    	$('div .first span').prev().css('border', '1px solid #cc0000');
    });
    

    Пояснение:

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

    Результат:

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

• Задача 2:

  - обвести красной рамкой (#cc0000) только div элементы, которые расположены сразу же перед элементами span и находятся с ними на одном уровне вложенности.

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

  • Решение:

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

    Пояснение:

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

    Результат:

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