En jQuery, comment utiliser un sélecteur pour accéder à tous les éléments sauf le premier ? Ainsi, dans le code suivant, seuls les deuxième et troisième éléments seraient accessibles. Je sais que je peux y accéder manuellement, mais comme il peut y avoir un nombre illimité d'éléments, ce n'est pas possible. Merci.
<div class='test'></div>
<div class='test'></div>
<div class='test'></div>
Voici un JsPerf comparant toutes ces solutions : jsperf.com/le moyen le plus rapide de sélectionner tout ce que l'on attend du premier coup En fonction du nombre d'articles, $("li").not(":eq(0)") semble bon.
J'adore cette liste. Je voulais juste ajouter : $("div.test:first").siblings().hide() . J'ai trouvé utile de commencer par le premier élément, puis de masquer tous ses frères et sœurs même s'ils ne sont pas trouvés avec un sélecteur commun.
En raison de la manière dont les sélecteurs jQuery sont évalués de droite à gauche le très lisible li:not(:first) est ralentie par cette évaluation.
Un système tout aussi rapide et facile à lire La solution consiste à utiliser la version de la fonction .not(":first") :
par exemple
$("li").not(":first").hide();JSPerf : http://jsperf.com/fastest-way-to-select-all-expect-the-first-one/6
Ce n'est que quelques points de pourcentage de moins que slice(1) mais il est très facile à lire comme "Je veux tout sauf le premier".
Ma réponse est axée sur un cas étendu dérivé de celui exposé en haut.
Supposons que vous ayez un groupe d'éléments dont vous voulez cacher les éléments enfants sauf le premier. Par exemple :
<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>Nous voulons cacher tout .child éléments sur chaque groupe. Donc, cela n'aidera pas car cela cachera tous les .child éléments sauf visible#1 :
$('.child:not(:first)').hide();La solution (dans ce cas étendu) sera :
$('.some-group').each(function(i,group){
$(group).find('.child:not(:first)').hide();
});
$(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> Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.
0 votes
Regardez cette réponse stackoverflow.com/questions/4831334/