JQuery'de dizine göre bir öğe alın

Sırasız bir listem ve libu listedeki bir etiketin dizini var . Ben almak zorunda liolduğu dizini kullanarak elemanı ve arka plan rengini değiştirin. Bu, tüm listeyi döngüye sokmadan mümkün müdür? Demek istediğim, bu işlevi gerçekleştirebilecek herhangi bir yöntem var mı?

İşte işe yarayacağına inandığım kodum ...

<script type="text/javascript">
  var index = 3;
</script>

<ul>
    <li>India</li>
    <li>Indonesia</li>
    <li>China</li>
    <li>United States</li>
    <li>United Kingdom</li>
</ul>

<script type="text/javascript">
  // I want to change bgColor of selected li element
  $('ul li')[index].css({'background-color':'#343434'});

  // Or, I have seen a function in jQuery doc, which gives nothing to me
  $('ul li').get(index).css({'background-color':'#343434'});
</script>

$(...)[index]      // gives you the DOM element at index
$(...).get(index)  // gives you the DOM element at index
$(...).eq(index)   // gives you the jQuery object of element at index

DOM nesnelerinin cssişlevi yoktur, sonuncuyu kullanın ...

$('ul li').eq(index).css({'background-color':'#343434'});

docs:

.get(index) İade: Eleman

• Açıklama: jQuery nesnesi ile eşleşen DOM öğelerini alın.
• Bakınız: https://api.jquery.com/get/

.eq(index) İade: jQuery

• Açıklama: Eşleşen öğeler kümesini belirtilen dizindekine düşürün.
• Bakınız: https://api.jquery.com/eq/

.eq()Belirli bir dizine sahip öğeyi almak için jQuery yöntemini kullanabilirsiniz .

$('ul li').eq(index).css({'background-color':'#343434'});

Sen kullanabilirsiniz eq yöntemini veya seçici :

$('ul').find('li').eq(index).css({'background-color':'#343434'});

CSS :nth-of-typesözde sınıfını kullanarak jQuery'de indekse göre bir öğe almanın başka bir yolu vardır :

<script>
    // css selector that describes what you need:
    // ul li:nth-of-type(3)
    var selector = 'ul li:nth-of-type(' + index + ')';
    $(selector).css({'background-color':'#343434'});
</script>

İhtiyacınız olan herhangi bir öğeyi eşleştirmek için jQuery ile kullanabileceğiniz başka seçiciler de vardır .

Jquery'yi atlayabilir ve yalnızca CSS stili etiketlemeyi kullanabilirsiniz:

 <ul>
 <li>India</li>
 <li>Indonesia</li>
 <li style="background-color:#343434;">China</li>
 <li>United States</li>
 <li>United Kingdom</li>
 </ul>