Odpowiedzi:
Dlaczego nie przejrzeć najpierw (krótkiej) strony selektorów?
Oto on: :eq()operator. Jest używany tak jak get(), ale zwraca obiekt jQuery.
Możesz też użyć .eq()funkcji.
.eq()jest bardziej odpowiedni dla pytania PO. :eq()jest używany w parametrze ciągu do $, natomiast .eq()jest metodą na istniejącym obiekcie jQuery.
$('select').find('option').eq(n)po prostu zignoruje grupowanie i uzyska wszystkie opcje jako całość. Jeśli chcesz na grupę, konieczne jest coś takiego:$('select').find('optgroup').each(function() { $(this).find('option').eq(n)...; })
Możesz użyć selektora : eq , na przykład:
$("td:eq(2)").css("color", "red"); // gets the third td element
Lub funkcja eq (int) :
$("td").eq(2).css("color", "red");
Pamiętaj też, że indeksy są zerowane.
:nth()selektora - nie należy mylić:nth-child()
jeśli masz kontrolę nad zapytaniem, które buduje obiekt jQuery, użyj :eq()
$("div:eq(2)")
Jeśli nie masz nad tym kontroli (na przykład, jest przekazywany z innej funkcji lub czegoś), użyj .eq()
var $thirdElement = $jqObj.eq(2);
Lub jeśli chcesz ich część (powiedzmy trzeci, czwarty i piąty element), użyj .slice()
var $third4th5thElements = $jqObj.slice(2, 5);
.eq()zamiast :eq()faktycznie. Niewielki wzrost wydajności.
.eq () - Liczba całkowita wskazująca pozycję elementu na podstawie 0.
Dawny:
Rozważ stronę z prostą listą:
<ul>
<li>list item 1</li>
<li>list item 2</li>
<li>list item 3</li>
<li>list item 4</li>
</ul>
Możemy zastosować tę metodę do zestawu elementów listy:
$( "li" ).eq( 2 ).css( "background-color", "red" );
Jeśli masz już obiekt jquery w zmiennej, możesz również traktować go jak zwykłą tablicę indeksowaną, bez użycia jquery:
var all_rows = $("tr");
for(var i=0; i < all_rows.length; i++){
var row = all_rows[i];
//additionally, you can use it again in a jquery selector
$(row).css("background-color","black");
}
Chociaż powyższy przykład nie jest w żaden sposób przydatny, reprezentuje on, w jaki sposób można traktować obiekty utworzone przez jquery jako tablice indeksowane.
<select>elementów, a chcesz wybrany element combobox, użyj$(row).val();
Jeśli dobrze rozumiem twoje pytanie, zawsze możesz po prostu owinąć funkcję get w następujący sposób:
var $someJqueryEl = $($('.myJqueryEls').get(3));
eq()daje ci za darmo.
Jeśli chcesz pobrać konkretny element / węzeł lub tag w pętli np
<p class="weekday" data-today="monday">Monday</p>
<p class="weekday" data-today="tuesday">Tuesday</p>
<p class="weekday" data-today="wednesday">Wednesday</p>
<p class="weekday" data-today="thursday">Thursday</p>
Tak więc, z powyższej pętli kodu jest wykonywana i chcemy, aby wybrane pole było wybrane, dlatego musimy użyć wyboru jQuery, który może wybrać tylko element oczekujący z powyższej pętli, więc kod będzie
$('.weekdays:eq(n)');
na przykład
$('.weekdays:eq(0)');
jak również inną metodą
$('.weekday').find('p').first('.weekdays').next()/last()/prev();
ale pierwsza metoda jest bardziej wydajna, gdy HTML <tag>ma unikalną nazwę klasy.
UWAGA: Drugą metodę stosuje się, gdy nie ma ona nazwy klasy w elemencie docelowym lub węźle.
Aby uzyskać więcej, odwiedź https://api.jquery.com/eq/
W przypadku iteracji użycie selektora nie wydaje się jednak mieć żadnego sensu:
var some = $( '...' );
for( i = some.length -1; i>=0; --i )
{
// Have to transform in a jquery object again:
//
var item = $( some[ i ] );
// use item at will
// ...
}
<html>
<head></head>
<body>
<script type="text/javascript"
src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('li:eq(1)').hide();
});
</script>
<ol>
<li>First</li>
<li>Second</li>
<li>Third</li>
</ol>
</body>
</html>
Po uruchomieniu na liście uporządkowanej znajdują się dwa elementy: Pierwszy i Trzeci. Drugi był ukryty.
$(function(){
$(document).find('div').siblings().each(function(){
var obj = $(this);
obj.find('div').each(function(){
var obj1 = $(this);
if(!obj1.children().length > 0){
alert(obj1.html());
}
});
});
});
<div id="2">
<div>
<div>
<div>XYZ Pvt. Ltd.</div>
</div>
</div>
</div>
<div id="3">
<div>
<div>
<div>ABC Pvt Ltd.</div>
</div>
</div>
</div>
.eq()zamiast:eq()?