jQuery select all except first

W jQuery jak używać selektora, aby uzyskać dostęp do wszystkich elementów poza pierwszym? Tak więc w poniższym kodzie tylko drugi i trzeci element będzie dostępny. Wiem, że mogę uzyskać do nich dostęp ręcznie, ale może być dowolna liczba elementów, więc nie jest to możliwe. Dzięki.

<div class='test'></div>
<div class='test'></div>
<div class='test'></div>
Author: usertest, 2010-02-14
Source

4 answers

$("div.test:not(:first)").hide();

Lub: 

$("div.test:not(:eq(0))").hide();

Lub: 

$("div.test").not(":eq(0)").hide();

Lub: 

$("div.test:gt(0)").hide();

Lub: (zgodnie z komentarzem @ Jordan Lev): 

$("div.test").slice(1).hide();

I tak dalej.

Zobacz:

 522
Author: karim79,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2018-05-23 17:45:17

Ze względu na sposób, w jaki selektory jQuery są oceniane od prawej do lewej, dość czytelny li:not(:first) jest spowolniony przez tę ocenę.

Równie szybkim i łatwym do odczytania rozwiązaniem jest użycie wersji funkcji .not(":first"):

Np. 

$("li").not(":first").hide();

JSPerf: http://jsperf.com/fastest-way-to-select-all-expect-the-first-one/6

Jest to tylko kilka punktów procentowych wolniejsze niż slice(1), ale jest bardzo czytelne jako "chcę wszystkich z wyjątkiem pierwszego jeden".

 25
Author: Gone Coding,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2015-01-18 11:21:18

Moja odpowiedź koncentruje się na rozszerzonym przypadku wyprowadzonym z tego, który jest odsłonięty na górze. Extended Case:

Załóżmy, że masz grupę elementów, z których chcesz ukryć elementy potomne, z wyjątkiem pierwszego. Jako przykład: 

<html>
  <div class='some-group'>
     <div class='child child-0'>visible#1</div>
     <div class='child child-1'>xx</div>
     <div class='child child-2'>yy</div>
  </div>
  <div class='some-group'>
     <div class='child child-0'>visible#2</div>
     <div class='child child-1'>aa</div>
     <div class='child child-2'>bb</div>
  </div>
</html>
  1. chcemy ukryć wszystko".child " elementy na każdej grupie. Więc to nie pomoże, ponieważ ukryje wszystko".dziecko "elementy z wyjątkiem " widoczny#1":

$('.child:not(:first)').hide();

  1. rozwiązanie (w tym przypadku rozszerzonym) będzie be:

$('.some-group').each(function(i,group){ $(group).find('.child:not(:first)').hide(); });

 2
Author: christian,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-03-22 15:44:42 

$(document).ready(function(){

  $(".btn1").click(function(){
          $("div.test:not(:first)").hide();
  });

  $(".btn2").click(function(){
           $("div.test").show();
          $("div.test:not(:first):not(:last)").hide();
  });

  $(".btn3").click(function(){
          $("div.test").hide();
          $("div.test:not(:first):not(:last)").show();
  });

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<button class="btn1">Hide All except First</button>
<button class="btn2">Hide All except First & Last</button>
<button class="btn3">Hide First & Last</button>

<br/>

<div class='test'>First</div>
<div class='test'>Second</div>
<div class='test'>Third</div>
<div class='test'>Last</div>
 1
Author: Rafiqul Islam,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-10-25 05:20:59