JQuery - $ ('# test ul> li'). Índice (2) .hide(); - ¿posible?

Question

¿Puedo trabajar con el valor del índice tan fácilmente? Creo que usar los valores de índice naturales es mejor que usar clases. Quiero usar el .index de esa manera.

HTML

<div id="test"> 
<ul> 
<li>Im index 0</li> 
<li>Im index 1</li> 
<li>Im index 2</li> 
<li>Im index 3</li> 
</ul> 
</div> 

Pseudo (Jquery) Javascript

$('#test ul > li').index(2).hide(); 

$('#test ul > li').index(1).click(function() { 
alert('lulz you clicked the li with the index value of 1 bro'); 
}); 

que doesnt encontrar una idea de cómo trabajar de esta manera con el valor .index .. ¿es posible trabajar tan fácilmente con este ¿¿método??

Answer 1

Usted puede utilizar eq:

$('#test ul > li').eq(2).hide(); 

También puede ser una parte de su selector:

$('#test ul > li:eq(2)').hide(); 

Si quieres el tercer li en todas ul s en #test, puede utilizar nth-child (tenga en cuenta que se basa-1):

$('#test ul > li:nth-child(3)').hide(); 

Answer 2

Lo está usando con un número entero, pero solo puede usarlo con un selector o elemento. here

Editar:
Se podría escribir su propia función como esta:

function indexValue(index) 
{ 
    $(element).each(function(key, val) { 
     if(key+1 == index) // + 1 because you started from 0 
     { 
      return val; 
     } 
    }); 
} 

Answer 3

Sí se puede. ¿Quieres .eq() sin embargo, en lugar de .index():

$('#test ul > li').eq(2).hide(); 

O como parte del selector:

$('#test ul > li:eq(2)').hide(); 

Answer 4

$(document).ready(function(){ 
    $("button#1").click(function(){ 
    $("p").hide(); 
    }); 
}); 
$(document).ready(function(){ 
    $("button#2").click(function(){ 
    $("p").show(); 
    }); 
}); 
<button id="1">Clica-me</button> 
<button id="2">Volta-me</button>