jQuery выбрать все, кроме первого

Question

jQuery выбрать все, кроме первого

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

<div class='test'></div>

<div class='test'></div>

<div class='test'></div>

805 4

jQuery jquery-selectors

4 ответов:

Comments

Ничего не найдено.

karim79 · Accepted Answer · 2018-05-23 20:45:17

$("div.test:not(:first)").hide();
или:
$("div.test:not(:eq(0))").hide();
или:
$("div.test").not(":eq(0)").hide();
или:
$("div.test:gt(0)").hide();
или: (согласно комментарию @Jordan Lev):
$("div.test").slice(1).hide();
и так на.

посмотреть:

http://api.jquery.com/first-selector/

http://api.jquery.com/not-selector/

http://api.jquery.com/gt-selector/

https://api.jquery.com/slice/

Gone Coding · Accepted Answer · 2015-01-18 13:21:18

из-за того, как оцениваются селекторы jQuery справа-налево, вполне читабельный li:not(:first) замедляется в результате этой оценки.

одинаково быстро и легко читать решение использует функцию version .not(":first"):

например
$("li").not(":first").hide();
см. Этот тест jsperf:http://jsperf.com/fastest-way-to-select-all-expect-the-first-one/6

это всего лишь несколько процентных пунктов медленнее, чем slice(1), но очень читается как "я хочу все, кроме первого".

christian · Accepted Answer · 2017-03-22 17:44:42

мой ответ сосредоточен на расширенном случае, полученном из того, что выставлено сверху. Расширенный Вариант:

Предположим, у вас есть группа элементов, из которой вы хотите скрыть дочерние элементы, кроме первого. В качестве примера:
<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":

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

решение (в этом случае) будет:

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

Rafiqul Islam · Accepted Answer · 2017-10-25 08:20:59

$(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>