jQuery jQuery选择除第一个之外的所有

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/2259393/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 13:08:26  来源:igfitidea点击:

jQuery select all except first

jqueryjquery-selectors

提问by usertest

In jQuery how do I use a selector to access all but the first of an element? So in the following code only the second and third element would be accessed. I know I can access them manually but there could be any number of elements so thats not possible. Thanks.

在 jQuery 中,如何使用选择器访问除第一个元素之外的所有元素?所以在下面的代码中,只会访问第二个和第三个元素。我知道我可以手动访问它们,但可能有任意数量的元素,所以这是不可能的。谢谢。

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

回答by karim79

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

or:

或者:

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

or:

或者:

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

or:

或者:

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

or: (as per @Jordan Lev's comment):

或:(根据@Jordan Lev 的评论):

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

and so on.

等等。

See:

看:

回答by Gone Coding

Because of the way jQuery selectors are evaluated right-to-left, the quite readable li:not(:first)is slowed down by that evaluation.

由于 jQuery 选择器的计算方式是从右到左计算的,因此该计算li:not(:first)降低了可读性。

An equally fast and easy to readsolution is using the function version .not(":first"):

同样快速且易于阅读的解决方案是使用函数版本.not(":first")

e.g.

例如

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

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

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

This is only few percentage points slower than slice(1), but is very readable as "I want all except the first one".

这仅比 慢几个百分点slice(1),但非常易读,因为“我想要除了第一个之外的所有内容”。

回答by christian

My answer is focused to a extended case derived from the one exposed at top.

我的回答集中在一个扩展案例上,该案例源自顶部暴露的案例。

Suppose you have group of elements from which you want to hide the child elements except first. As an example:

假设您有一组元素,要从中隐藏子元素,但第一个除外。举个例子:

<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. We want to hide all .childelements on every group. So this will not help because will hide all .childelements except visible#1:

    $('.child:not(:first)').hide();
    
  2. The solution (in this extended case) will be:

    $('.some-group').each(function(i,group){
        $(group).find('.child:not(:first)').hide();
    });
    
  1. 我们想隐藏.child每个组上的所有元素。所以这无济于事,因为会隐藏所有.child元素,除了visible#1

    $('.child:not(:first)').hide();
    
  2. 解决方案(在这种扩展情况下)将是:

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

回答by Rafiqul Islam

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