如何添加类使用jquery

Question

我用下面的jQuery代码为我举表

$(document).ready(function() { 
    $('.table>tr>td').addClass('redBg'); 
    console.log('hg');  
}); 

到TD中举表标签，以及我想这一个

$(document).ready(function() { 
    $('.table>tbody>tr>td').addClass('redBg'); 
    console.log('hg'); 

}); 

但类不会加入到td标签，

这里是工作提琴https://jsfiddle.net/udarazz/0vx7tjfq/

任何人都可以帮助我解决这个问题吗？

Answer 1

如果你忽略它，许多浏览器将隐式添加一个容器来包装所有表行。您可以使用浏览器的开发人员工具/检查器对其进行验证。所得的结构：

<table> 
    <tbody> 
     <tr> 
      <td></td> 
     </tr> 
    </tbody> 
</table> 

这意味着<tr>不再是<table>直接孩子，你table > tr选择将不再工作。

要解决它，你可以：

• 明确包括<tbody>在您的标记和使用table > tbody > tr > td选择。 table tr > td

工作JSFiddle：

不要使用直接子选择器。

自举风格偶数行和徘徊的背景，你可能需要让你的类定义不是引导的内置样式更加具体：

table.table tr > td.redBg { 
    background-color: red; 
} 

或者，您可以添加!important你的CSS覆盖：

.redBg { 
    background-color: red !important; 
} 

Answer 2

修订JQUERY

$(document).ready(function() { 
    $('.table tr > td').addClass('redBg'); 
    console.log('hg'); 
}); 

Answer 3

如果其在<table>第一<td>你想添加类的使用方法：

$(document).ready(function() { 
    $('.table tr td:first-child').addClass('redBg'); 
    console.log('hg'); 
}); 

https://jsfiddle.net/0vx7tjfq/5/