Question

我需要一个jquery脚本来动态地将类添加到类行中的'div'。该课程用于设置边距。如果类行中有两个div，则只将class添加到第一个，如果有三个'div'，则将class添加到两个避免第三个。

因此，实际需要是计算'row'上的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

如果您不想将该课程应用于课程divs的{{1}}，那么您可以使用此课程

clear

或者

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

<强> 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++;

 });

});

通过循环遍历div动态地向子项添加类

3 个答案: