jQuery 선택기를 사용하여 같은 클래스의 다른 형제에게 어떻게 영향을 줍니까?

Question

동일한 클래스 이름을 가진 일련의 div에서 이미지의 수를 계산하기 위해 Length를 얻으려고 시도하고 있지만 각 DIV를 개별적으로 볼 수있는 jQuery를 얻을 수 없습니다. ... 12 개 이미지

를 대신 그것의 총 수를 계산합니다 : DIV 일 : 4 개 이미지, DIV 2 : 2 개 이미지, DIV 세

console.log($('.channel_titles_art').each(function(){ 
     console.log($('.channel_titles_art img').length); 
     }) 
); 

예를 들어, 내가 출력을하고 싶습니다 channel_titles_art 클래스를 사용하여 모든 div의 자식 인 이미지를 여러 번 반복합니다 (세 개의 div 인 "18 개 이미지"는 세 번 반복됩니다)

각 div를 개별적으로 반복 할 수있는 방법이 있습니까?

Answer 1

당신은 this을 사용할 수 있습니다

$('.channel_titles_art').each(function(){ 
    console.log($('img', this).length); 
}) 

당신이 원하는 것을 표시 :

여기

$('.channel_titles_art').each(function(){ 
    var amt_of_images = $('img', this).length; 
    console.log(this, 'has '+amt_of_images+' images'); 
}) 

이 예 fiddle :-)

Answer 2

입니다. $('.channel_titles_art img')을 $('img', this) 또는 $(this).find('img')으로 변환하십시오.

이 요소는 .channel_titles_art과 일치하는 현재 요소의 컨텍스트에있는 모든 이미지를 찾고 원본 일치자는 모두 .channel_titles_art 내의 모든 이미지와 일치합니다.

대안을 표시하기 위해 .length 대신 .size()으로 찾기 (복사 붙여 넣기 Neal)를 사용하는 예제입니다.

$('.channel_titles_art').each(function(){ 
    console.log($(this).find('img').size()); 
}) 

그리고

$('.channel_titles_art').each(function(){ 
    var amt_of_images = $(this).find('img').size(); 
    console.log(this, 'has '+amt_of_images+' images'); 
}) 

그리고 fiddle

(다시 닐의 좋은 일을 남용).

Answer 3

넵. 당신은 channel_titles_art 클래스의 모든 요소를 ​​묻고 나서 모든 이미지를 안에 넣고 블록 안에있는 모든 것의을 묻습니다. 지정해야합니다. this을 현재 작업중인 항목에 대한 참조로 사용하고 $ 함수의 parent 필드를 사용하여 작업 할 수 있습니다.

console.log($('.channel_titles_art').each(function(){ 
     console.log($('img', this).length); 
     }) 
);