web-dev-qa-db-fra.com

Obtenir un élément par index dans jQuery

J'ai une liste non ordonnée et l'index d'une balise li dans cette liste. Je dois obtenir l'élément li à l'aide de cet index et changer sa couleur d'arrière-plan. Est-ce possible sans boucler toute la liste? Je veux dire, y at-il une méthode qui pourrait atteindre cette fonctionnalité?

Voici mon code, qui, je crois, fonctionnerait ...

<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>
jquerydomget
104
Rama Rao M
$(...)[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

Les objets DOM n'ont pas la fonction css, utilisez le dernier ...

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

docs:

.get(index) Retourne: Element

.eq(index) Retourne: jQuery

234
gdoron

Vous pouvez utiliser la méthode .eq() de jQuery pour obtenir l'élément avec un certain index.

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

Vous pouvez utiliser le méthode eq ou sélecteur :

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

Il existe un autre moyen d’obtenir un élément par index dans jQuery en utilisant CSS :nth-of-type pseudo-classe:

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

Il existe d’autres sélecteurs que vous pouvez utiliser avec jQuery pour faire correspondre tous les éléments dont vous avez besoin.

0
Yury Fedorov