JQuery: удалить 20-й + предмет

Question

Я добавляю li к ul каждые несколько секунд. Я хочу установить ограничение в 20 пунктов. После того, как есть 20 предметов, я хочу удалить самый старый, чтобы не было больше 20 предметов. Как я могу сделать это в JQuery?

Answer 1

Вы можете использовать селектор gt , чтобы выбрать все после определенного элемента или lt для чего-либо до. Вам придется использовать атрибут длины массива, если вам нужно выяснить существующую длину.

EG:

$('#ulID li:gt(19)').remove()

Вы также можете использовать: first и: last, если вы никогда не вставляете более 1 элемента одновременно.

Answer 2

Чтобы удалить последнего ребенка, сделайте:

$('li:last-child').remove();

Для удаления 20-го ребенка сделать (0 проиндексировано)

$('li:eq(19)').remove();

Answer 3

После того, как вы добавите, сделайте следующее ...

//Assuming $ul = a jquery object that contains your ul element.
//If there are more than 20 items, remove oldest item
if ($ul.children().size() > 20) {
    $ul.children(":last-child").remove();
}

или, если у вас уже есть элементы li в объекте jquery, вы также можете сделать следующее

if ($li.size() > 20) {
    $li.find(":last-child").remove();
}