divをループして子クラスに動的にクラスを追加する

Question

クラス行の 'div'に動的にクラスを追加するにはjqueryスクリプトが必要です。クラスはマージンを設定するためのクラスです。クラス行に2つのdivがある場合は、最初のクラスのみにクラスを追加し、3つの 'div'がある場合は、2つにクラスを追加して3を避けます。

実際には、 '行'のdivを計算し、最後のdiv以外のdivを追加する必要があります。ここに私のHTMLは次のとおりです。 - ここに

<div class="row"> 
        <div class="two-col"> 
         <h3>Header 2/3 Column</h3> 
         <p>Kidney Cancer Canada is a charitable patient-led support organization established to improve the quality of life for patients and their 
         families living with kidney cancer. <a href="#">Kidney Cancer Canada</a> advocates for access to netreatments, provides support and information to patients, 
         funds much-needed research, and works to increase awareness of kidney cancer as a significant health issue. Our goal is to help patients navigate 
         through information about their disease and ensure they have access to new treatment options available to them.</p> 
        </div> 
        <div class="one-col"> 
         <h3>Header 1/3 Column</h3> 
         <p>KCC hosts patient and caregiver education meetings and webcasts from locations all across canada. Atttending meetings in-person provides an 
         excellent oppurtunity to meet other kidney cancer patients, caregivers, and healthcare professionals</p> 
        </div> 
        <div class="clear"></div> 
       </div> 
       <div class="row"> 
        <div class="one-col"> 
         <h3>Header 1/3 Column</h3> 
         <p>KCC hosts patient and caregiver education meetings and webcasts from locations all across canada. Atttending meetings in-person provides an 
         excellent oppurtunity to meet other kidney cancer patients, caregivers, and healthcare professionals</p> 
        </div> 
        <div class="one-col"> 
         <h3>Header 1/3 Column</h3> 
         <p>KCC hosts patient and caregiver education meetings and webcasts from locations all across canada. Atttending meetings in-person provides an 
         excellent oppurtunity to meet other kidney cancer patients, caregivers, and healthcare professionals</p> 
        </div> 
        <div class="one-col"> 
         <h3>Header 1/3 Column</h3> 
         <p>KCC hosts patient and caregiver education meetings and webcasts from locations all across canada. Atttending meetings in-person provides an 
         excellent oppurtunity to meet other kidney cancer patients, caregivers, and healthcare professionals</p> 
        </div> 
        <div class="clear"></div> 
       </div> 

Answer 1

あなたはクラスclearであなたのdivsにそのクラスを適用したくない場合は、これを使用することができます

$('div.row').find('div').addClass('yourclass').not(':last-child,.clear'); 

それとも

$('div.row').find('div').addClass('yourclass').not(':last-child'); 

Live Sample

Answer 2

は、このタスクを実行するためのスクリプトです：

$.each($(".row"),function() { 

     var length = $(this).find('.two-col').length+$(this).find('.one-col').length+$(this).find('.three-col').length; 
      for(i=1;i<length;i++) 
      { 
      $(this).find(":nth-child("+i+")").addClass('margin-right'); 
      } 
    }); 

Answer 3

$("div.row").each(function(){ 

len = $(this).find("div").length ; 
if ($(this).find("div.clear").length > 0){ 
    len = len-1; 
} 
var i=0; 
$(this).find("div").each(function(){ 
if($(this).attr("class") != "clear"){ 
if (i < len-1){ 
    $(this).addClass("margin_class"); 
    } 
} 
i++; 

}); 

});