주어진 클래스 내의 모든 클래스에 대해 반복 수행

Question

<div class="contain_questions"> 
    <div class="question"> 
     <div class="question_text">First question</div> 
     <div class="question_mandatory">1</div> 

     <div class="options"> 
      <div class="option"><div class="option_name">a</div><div class="option_value">1</div></div> 
      <div class="option"><div class="option_name">b</div><div class="option_value">2</div></div> 
      <div class="option"><div class="option_name">c</div><div class="option_value">3</div></div> 
     </div> 

     <a href="" class="add_another_option">add_another_option</a> 
    </div> 

    . 
    . // many more div.question ... 
    . 

    <input type="button" value="submit_questions" /> 
</div> 

각 질문에 대해 .each() 외부에서 각 div.option에 대해 .each()를 어떻게 사용합니까? 나는 바깥 쪽 .each() 함수를 사용하여 모든 div.question을 반복 처리하고 question_text 등을 배열로 푸시하지만 모든 질문에 옵션 컨테이너를 지정하여 모든 옵션을 푸시하는 것처럼 보인다. 각 질문을 배열에 넣습니다.

또한 .each() 함수를 사용하여 DOM의 하위 집합을 타겟팅 할 수 있습니까? 아니면 주어진 클래스 내의 모든 클래스를 반복 할 수있는 다른 방법이 있습니까?

고마워 ..와

Answer 1

그냥 간단 :

var questions = []; 
$(".question").each(function() { 
    var obj = { 
     name : $(this).find(".question_text").text(), 
     options : [] 
    }; 

    $(this).find(".option").each(function() { 
     obj.options.push({ 
      name : $(this).find(".option_name").text(), 
      value : $(this).find(".option_value").text() 
     }); 
    }); 

    questions.push(obj); 
}); 

console.log(questions);