Question

      <td class="rsvp_role "> <input value="0" name="rsvp_role186[]" type="hidden"><span class="squaredFour" style="marign-top:-9px;" id="spnrsvp_Tank186"><input id="rsvp_Tank186" name="rsvp_role186[]" value="21" class="rsvpclass_186" style="margin-right:-10px;" type="checkbox"><label style=" margin-top:-3px;" for="rsvp_Tank186"></label></span></td>
      <td class="rsvp_role "> <input value="0" name="rsvp_role186[]" type="hidden"><span class="squaredFour" style="marign-top:-9px;" id="spnrsvp_Healer186"><input id="rsvp_Healer186" name="rsvp_role186[]" value="22" class="rsvpclass_186" style="margin-right:-10px;" type="checkbox"><label style=" margin-top:-3px;" for="rsvp_Healer186"></label></span></td>
      <td class="rsvp_role "> <input value="0" name="rsvp_role186[]" type="hidden"><span class="squaredFour" style="marign-top:-9px;" id="spnrsvp_Dps186"><input id="rsvp_Dps186" name="rsvp_role186[]" value="23" class="rsvpclass_186" style="margin-right:-10px;" type="checkbox"><label style=" margin-top:-3px;" for="rsvp_Dps186"></label></span></td>
      <td class="rsvp_role "> <input value="0" name="rsvp_role186[]" type="hidden"><span class="squaredFour" style="marign-top:-9px;" id="spnrsvp_Support186"><input id="rsvp_Support186" name="rsvp_role186[]" value="25" class="rsvpclass_186" style="margin-right:-10px;" type="checkbox"><label style=" margin-top:-3px;" for="rsvp_Support186"></label></span></td>
      <td class="rsvp_role "> <input value="0" name="rsvp_role186[]" type="hidden"><span class="squaredFour" style="marign-top:-9px;" id="spnrsvp_N/A186"><input id="rsvp_N/A186" name="rsvp_role186[]" value="26" class="rsvpclass_186" style="margin-right:-10px;" type="checkbox"><label style=" margin-top:-3px;" for="rsvp_N/A186"></label></span></td>

以上是我的views.php的html源代码。在上面，它是动态创建的。我想将一些css添加到第3类并休息其他我不想改变。因为除了第3类以外的所有都正确对齐而第3类没有正确对齐。如果我应用适用于所有人的共同风格并影响其他类。

是否可以在一个或多个中检测第三类，以便我可以将某种样式应用于该特定类。

Answer 1

尝试使用.eq(index)，

$('td.rsvp_role').eq(2) //since .eq() is having zero based index, 2 points 3

根据您的新请求，您必须使用

$('tr td.rsvp_role:nth-child(3)')

Answer 2

示例代码http://jsfiddle.net/dDuRh/1/

jQuery - nth-child(3n)和nth-child(3)

$('td.rsvp_role:nth-child(3)').css({'color': 'red'});   // only first third item


$('td.rsvp_role:nth-child(3n)').css({'color': 'red'});  // it will effect third item continuously


$('td.rsvp_role:nth-child(3n)').addClass('newClass')

CSS

.rsvp_role:nth-child(2){

}

Answer 3

我认为你需要将css设计与DOM元素相结合......你可以这样做

$(document).ready(function () {
   $('td.rsvp_role').eq(2).css({'background-color':'#343434'});
});

Example

Answer 4

试试这个$('td.rsvp_role:eq(2)');

Answer 5

您可以使用：

$('td.rsvp_role:nth-child(x)');// : x start at 1.

和

eq(x); // : x start at 0;

或者如果您想了解更多细节，请参阅

$('td.rsvp_role').each(function(i) {
if(i == x) {
}
})

如何检测班级位置和应用风格

5 个答案: