Как выбрать элемент?

Question

Почему этот код не работает? И есть ли другой способ выбрать первый элемент?

<div> 
    <a href="#">text</a> 
    <a href="#">text</a> 
</div> 

<script type="text/javascript"> 
$(function() { 
    $('div a').each(function(){ 
      $(':first', this).css('color', 'red'); 
     //...other actions with $(this) 
    }); 
}); 
</script> 

Я знаю, что я могу выбрать элемент вроде этого: $('div a:first')

Answer 1

Может быть, это то, что вы хотите

<div> 
    <a href="#">text</a> 
    <a href="#">text</a> 
</div> 

<script type="text/javascript"> 
    $(function() { 
     $('div a').each(function(i, elm){ 
      if (i == 0){ 
       $(elm).css('color', 'red'); 
      }        
      //...other actions with $(this) 
     }); 
    }); 
</script> 

Answer 2

Внутри каждого цикла $ (это) является объект, который вы ищете. Вам не нужно делать какой-либо дальнейший отбор, если вы не ищете что-то внутри $ (этого). Если вы пытаетесь выделить первое, вы должны сделать это за пределами вызова для каждого, потому что не имеет смысла называть его n раз.

Answer 3

$(function() { 
    $('div a').each(function(index){ 
      if(index === 0){ 
       $(this).css('color', 'red'); 
      } 
     //...other actions with $(this) 
    }); 
}); 

Answer 4

Они будут работать.

$('div a').first(); 
$('div a').eq(0); 
$('div a').slice(0,1); 
$('div a').filter(':first'); 

Если вам нужен только первый, отсутствие смысловой петли.

Если вам понадобятся остальная часть их для какой-либо цели, кешируйте результат селектора, вытащить тот, который вам нужен.

var $div_a = $('div a'); 

$div_a.first(); // for the first 
$div_a.slice(1,4); // for the second through fourth