Как "поп" или "смена" из набора jQuery

В Javascript массивы должны иметь методы pop и shift.

Однако объектам JQuery, кажется, не хватает этих методов:

$('div').shift(); // Error, shift is undefined
$('div').pop(); // Error, pop is undefined
$('div').splice(); // Splice is OK actually

Интересно, почему эти функции отсутствуют? В конце концов, объект jquery - это просто массив.

Какой самый простой способ выполнения функций pop и shift для объектов jquery?

Ответы

Ответ 1

Они отсутствуют, потому что объект jQuery не является массивом.

(function( $ ) {
    $.fn.pop = function() {
        var top = this.get(-1);
        this.splice(this.length-1,1);
        return top;
    };

    $.fn.shift = function() {
        var bottom = this.get(0);
        this.splice(0,1);
        return bottom;
    };
})( jQuery );

EDIT: .slice() не изменяет оригинальный объект. Исправлено использование .splice().

Ответ 2

Ваша самая безопасная ставка будет заключаться в том, чтобы просто использовать:

[].pop.call($('div'))
[].shift.call($('div'))

Если вы хотите использовать точный синтаксис в своем примере, вы можете увеличить jQuery.fn:

jQuery.fn.pop = [].pop;
jQuery.fn.shift = [].shift;

Последний работает хорошо для методов мутаторов. Он будет работать для accessor и iteration методы, но имейте в виду, что многие из них возвращают чистый массив, который вам придется переписывать. Имейте в виду, что у jQuery есть собственная версия некоторых из них (например, . Map, .slice, . filter и т.д.), которые вы, вероятно, не хотите перезаписывать.

Ответ 3

Казалось, это сработало для меня:

var divArray = $('div').toArray();
var elem = $( divArray.shift() );

.toArray() возвращает элементы DOM в виде массива JavaScript, которые могут использоваться по назначению. Затем все, что вам нужно сделать, это преобразовать его обратно в объект jQuery.

Ответ 4

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

$('div > :first').detach(); // shift
$('div > :last').detach();  // pop

Кстати, я понимаю, что проблемы с производительностью связаны с использованием: последнего селектора как части основного селектора, поэтому вы можете подумать о том, чтобы сделать что-то вроде этого для pop:

$('div').children(':last').detach();

Ответ 5

var $firstDiv = $( $('div').splice(0, 1) );

Ответ 6

Другой способ: jQuery 1.9.1+:

$('div').first().remove();  
$('div').last().remove();