Maison > Article > interface Web > Explication détaillée de l'obtention par jquery de l'instance de méthode element index()

Explication détaillée de l'obtention par jquery de l'instance de méthode element index()

伊谢尔伦original: 2017-06-19 15:11:461594parcourir

La méthode index() de jquery recherche les éléments correspondants et renvoie la valeur d'index de l'élément correspondant, en comptant à partir de 0.
Si aucun paramètre n'est transmis à la méthode .index(), la valeur de retour est la position du premier élément de la collection jQuery object par rapport à ses éléments frères.
Si le paramètre est un ensemble d'éléments DOM ou d'objets jQuery, alors la valeur de retour est la position de l'élément transmis par rapport à l'ensemble d'origine.
Si le paramètre est un sélecteur, la valeur de retour est la position de l'élément d'origine par rapport à l'élément correspondant par le sélecteur. Si aucun élément correspondant n'est trouvé, -1 est renvoyé.

L'exemple de code est le suivant :

<ul> 
<li id="foo">foo</li> 
<li id="bar">bar</li> 
<li id="baz">baz</li> 
</ul> 
$(&#39;li&#39;).index(document.getElementById(&#39;bar&#39;)); //1，传递一个DOM对象，返回这个对象在原先集合中的索引位置 
$(&#39;li&#39;).index($(&#39;#bar&#39;)); //1，传递一个jQuery对象 
$(&#39;li&#39;).index($(&#39;li:gt(0)&#39;)); //1，传递一组jQuery对象，返回这个对象中第一个元素在原先集合中的索引位置 
$(&#39;#bar&#39;).index(&#39;li&#39;); //1，传递一个选择器，返回#bar在所有li中的做引位置 
$(&#39;#bar&#39;).index(); //1，不传递参数，返回这个元素在同辈中的索引位置。

jquery pour obtenir la valeur d'index de l'élément index() exemple

pour une liaison de deuxième ou troisième niveau

<div id="nav"> 
<a href="#">建站素材</a> 
<a href="#">jquery特效</a> 
<a href="#">懒人主机</a> 
<a href="#">前端路上</a> 
</div> 
$("#nav a").click(function(){ 
//四个经典的用法 
var index1 = $("#nav a").index(this); 
var index2 = $("#nav a").index($(this)); 
var index3 = $(this).index() 
var index3 = $(this).index("a") 
alert(index3); 
return false; 
});

<html> 
<head> 
<script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.8.2/jquery.min.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
$("button").click(function(){ 
alert($(".hot").index($("#favorite"))); 
}); 
}); 
</script> 
</head> 
<body> 
请点击下面的按钮，以获得 id="favorite" 的元素相对于 jQuery 选择器 (class="hot") 的 index： 
<button>获得 index</button> 
<ul> 
<li>Milk</li> 
<li class="hot">Tea</li> 
<li class="hot" id="favorite">Coffee</li> 
</ul> 
</body> 
</html>

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：Résumé de 6 méthodes pour obtenir des éléments en jqueryArticle suivant：Résumé de 6 méthodes pour obtenir des éléments en jquery

Articles Liés

Voir plus