Как повторно выбрать элементы фильтра, когда у меня уже есть объект jquery?

Question

function initItems($items, current, count) { 
    $items.removeClass('z-item-current'); 
    $items.each(function(index) { 
     var $self = $(this); 
     $self.data('z-item-index', index); 
     if(index === current) { 
      $self.addClass('z-item-current z-item-show'); 
      var pre = current - 1, 
       next = current + 1; 
      pre = pre < 0 ? count - 1 : pre; 
      next = next > count - 1 ? 0 : next; 
      $($items[pre]).addClass('z-item-previous z-item-show'); 
      $($items[next]).addClass('z-item-next z-item-show'); 
     } 
    }); 
    // reselect or filter $items 
    // if has z-item-show class, show it; otherwise, hide it. 
}; 

Как показывает код выше, я хочу повторно выбрать/фильтровать объект jQuery. Чтобы быть конкретным, я хочу разделить $items на $items with z-item-show class и $items without z-item-show class.

В настоящее время $items.each - это подход, а $items.parent().find - это еще один.

Любой другой подход (более элегантный)?

Answer 1

Вы могли бы просто использовать filter и not, чтобы захватить элементы с классом или нет:

$items.filter('.z-item-show').show(); 
$items.not('.z-item-show').hide(); 

Это чище, чем $items.each(), но, вероятно, будет менее эффективным, так как он делает 2 петли.

Answer 2

Как вы хотите просто обрабатывать существующие и новые предыдущие/ближайшие/текущие элементы, вы можете обрабатывать все это в своей существующей функции each. Просто проверьте его положение относительно текущего индекса и добавлять и удалять классы в зависимости от обстоятельств:

function initItems($items, current, count) { 
    $items.each(function(index) { 

     var $self = $(this); 
     $self.data('z-item-index', index); 

     if(index === current) { 
      // current item 
      $self.addClass('z-item-current z-item-show') 
       .removeClass('z-item-next z-item-previous'); 
     } 
     else if(index === (current == 0 ? count - 1 : current - 1)) { 
      // previous item 
      $self.addClass('z-item-previous z-item-show') 
       .removeClass('z-item-next z-item-current'); 
     } 
     else if(index === (current == count - 1 ? 0 : current + 1)) { 
      // next item 
      $self.addClass('z-item-next z-item-show') 
       .removeClass('z-item-current z-item-previous'); 
     } 
     else { 
      // none of the above - remove all classes 
      $self.removeClass('z-item-next z-item-previous z-item-current z-item-show'); 
     } 
    }); 
}; 

JSFiddle here