모든 1, 4 번째 아이템에 클래스 적용하기

Question

나는 16 개의 아이템 목록을 가지고 있습니다. 각 행에는 4 개의 항목이있는 4 개의 행이 있습니다. 각 행의 첫 번째 항목에 '.first'클래스를 추가하고 각 행의 네 번째 항목에 '.fourth'클래스를 추가하는 방법은 무엇입니까?

결과 : n 번째 자녀 또는 : n 번째의 유형 당신은 CSS 선택기를 사용하려면 같은

<ul> 
    <li class="first"></li> 
    <li></li> 
    <li></li> 
    <li class="fourth"></li> 
    <li class="first"></li> 
    <li></li> 
    <li></li> 
    <li class="fourth"></li> 
    <li class="first"></li> 
    <li></li> 
    <li></li> 
    <li class="fourth"></li> 
    <li class="first"></li> 
    <li></li> 
    <li></li> 
    <li class="fourth"></li> 
</ul> 

Answer 1

이 시도 :

$(function(){ 
    // You can use a more specific li selector as per your requirement 
    $("li").each(function(a, b){ 
     if(a%4 == 0){ 
      $(b).addClass("first"); 
     } 
     if(a%4 == 3){ 
      $(b).addClass("fourth"); 
     } 
    }); 
}); 

편집 :

n 번째의 아이를 사용 :

$(function(){ 
    var ul = $("ul");//You can use more specific UL 
    ul.find(":nth-child(4n-3)").addClass("first"); 
    ul.find(":nth-child(4n)").addClass("fourth"); 
}); 

근무 예 : http://jsfiddle.net/qmHNQ/

Answer 2

그것은 소리. jQuery에서이를 사용하여 클래스를 추가하거나 직접 가상 클래스로 사용할 수 있으며 추가 속성 추가를 건너 뛸 수 있습니다.

Answer 3

사용하여 각() : http://api.jquery.com/jQuery.each/

jQuery.each('ul li', function(indexInArray, valueOfElement){ 
    if ((indexInArray % 4) == 0) { $(this).addClass('first'); } 
    if ((indexInArray % 4) == 3) { $(this).addClass('fourth'); } 
}); 

Answer 4

": even"필터를 두 번 사용할 수 있는지 궁금합니다. 처음으로, 당신은 2로 나누어 모든 것들을 얻을 것, 두 번째는 :도 등을 1, 5를 설정하려면 4

$("li:gt(0):even:even").addClass("fourth"); 

에 의해 당신에게 그 ... 나눌의 모든 고르게을 줄 것이다 .. 아마 첫 번째 수업을 제외한 모든 강의를들을 수 있고 "첫번째 수업"을 적용 할 수 있습니다. 그런 다음 첫 번째 것도 설정하십시오.

$("li:first").addClass("first"); 
$("li:gt(1):even:even").addClass("first"); 

좋아요 ...이 작업은 수행되지만 일시적인 것처럼 보입니다. 이것은 효과가있다.