2013-06-03 4 views
1

ID # color-lines과 각 요소에 대한 고유 한 클래스가있는 요소 목록을 반복하는 중입니다. <div id="color-lines" class="block-2088"> 고유 한 클래스는 WordPress ID를 게시하여 각 블록이 고유하게됩니다.jQuery로 각 요소의 자식 요소 길이 가져 오기

각 div에는 다양한 숫자의 <a> 태그가 있으며 각 div에 몇 개의 하위 요소가 있는지에 따라 각 태그에 addClass를 사용하려고합니다. 내가 무엇을 얻을

$("#color-lines").each(function(){ 

     var className = $(this).attr("class"); 
     var anchoLink = ("." + className); 

     var n = $(anchoLink).children().length; 

     $(anchoLink).children().addClass("line-width-" + n); 

    }); 

는 각 사업부에서 <a> 요소를 다른 숫자가있다하더라도 모든 div 요소에 대해 동일한 클래스 line-with-n<a> 태그입니다.

+4

"는 ID 번호 색상 라인이 요소의 목록을 통해 반복"- 중지합니다. 이드는 유일해야합니다 ... – lifetimes

+1

... 그리고 수업을해서는 안됩니다. (글쎄요, 가능할 수도 있지만, 그다지 중요하지 않습니다.) – Blazemonger

+1

ID는 문서마다 고유해야합니다. 동일한 문서에서 동일한 ID를 가진 요소를 여러 개 가질 수 없거나 잘못되었습니다. – crush

답변

2

ID와 클래스를 전환하십시오. 즉, ID는 고유해야하며, 유사한 요소에 대해 클래스를 사용해야합니다. 당신은 같은 클래스와 요소의 each() 루프를 작성할 수 있습니다

$(".color-lines").each(function() { 
    var n = $(this).children.length; 
    $(this).children("a").addClass("line-width-" + n); 
}); 
+0

OK - 가장 유익한 방법은 tymeJV의 것 같습니다. ("line-width-"+ n); 용감하다. 감사 – user2018474

1

ID's은 고유해야하며 class은 중복 될 수 있습니다.

id을 선택자로 사용하는 경우에만 1 개 항목이므로 $('#color-lines).each은 첫 번째로만 반복합니다. #color-lines.

+1

예, 감사합니다! 이 작업을 : $ (".color-lines") .each (function() { \t \t \t var className = $ (this) .attr ("class"). split ('') [1 ] \t \t \t VAR의 anchoLink = (+ 클래스 명 "."). \t \t \t VAR N = $ (anchoLink) .children() 길이; \t \t \t $ (anchoLink + "A"). \t \t}); – user2018474

0

ID가 고유해야한다는 규칙에 동의하지만 DIV 선택기에 find() 호출을 추가해야합니다. 이 예제에서는 클래스와 ID 특성을 바꿨다고 가정했습니다.

관련 문제