Как выбрать последний дочерний элемент в jQuery?

57

Как выбрать последний дочерний элемент в jQuery?

Просто последний ребенок, а не его потомки.

Теги:

4 ответа

88
Лучший ответ

Вы также можете сделать это:

<ul id="example">
    <li>First</li>
    <li>Second</li>
    <li>Third</li>
    <li>Fourth</li>
</ul>

// possible 1
$('#example li:last').val();
// possible 2
$('#example').children().last()
// possible 3
$('#example li:last-child').val();

: последний

. children(). last()

: last-child

Поделиться
  • 4
    Я не думаю, что children().last() и :last-child равны. В этом примере - да, но представьте, что у вас есть два списка (class = "example"), а затем попробуйте выбрать последние элементы из обоих списков ...
  • 0
    @alekwisnia смотрите мой пример ниже.
Показать ещё 2 комментария
28 
$('#example').children().last()

или если вы хотите, чтобы последние дети с определенным классом комментировали выше.

$('#example').children('.test').last()

или конкретный дочерний элемент с определенным классом

$('#example').children('li.test').last()
Поделиться
8

Используя : селектор last-child?

Есть ли у вас конкретный сценарий, в котором вам нужна помощь?

Поделиться
0

Если вы хотите выбрать последнего ребенка и должны быть конкретными по типу элемента, вы можете использовать селектор last-of-type

Вот пример:

$("div p:last-of-type").css("border", "3px solid red");
$("div span:last-of-type").css("border", "3px solid red");

<div id="example">
            <p>This is paragraph 1</p>
            <p>This is paragraph 2</p>
            <span>This is paragraph 3</span>
            <span>This is paragraph 4</span>
            <p>This is paragraph 5</p>
        </div>

В приведенном выше примере как в пункте 4, так и в пункте 5 будет красная рамка, поскольку параграф 5 является последним элементом типа "p" в div, а параграф 4 является последним "пролетом" в div.

Поделиться

Ещё вопросы

Сообщество Overcoder
Наверх
Меню