Question

我试图找出是否可以在表格中命名具有相同类名的整个列，而无需为每个单独的单元命名。有什么建议？我会使用html，css或javascript这样做吗？命名每个单元格是唯一的方法吗？

很抱歉，如果我在错误的区域发布此信息，我是这个网站的新手并且仍在尝试解决这个问题

Answer 1

您可以使用nth-child伪类选择器

＆＃13;

table tr td:nth-child(2) {
  background: #CCCCCC;
}
table tr td:nth-child(4) {
  background: #00FFEE;
}

＆＃13;

<table>
  <tbody>
    <tr>
      <td>1-1</td>
      <td>1-2</td>
      <td>1-3</td>
      <td>1-4</td>
    </tr>
    <tr>
      <td>2-1</td>
      <td>2-2</td>
      <td>2-3</td>
      <td>2-4</td>
    </tr>
    <tr>
      <td>3-1</td>
      <td>3-2</td>
      <td>3-3</td>
      <td>3-4</td>
    </tr>
    <tr>
      <td>4-1</td>
      <td>4-2</td>
      <td>4-3</td>
      <td>4-4</td>
    </tr>
  </tbody>
</table>

＆＃13;

Answer 2

如果要为表中的所有元素添加一个类（在本例中为td元素），可以使用jQuery执行此操作。

＆＃13;

$('td').addClass('my-class');

＆＃13;

.my-class{
color: red;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tbody>
    <tr>
      <td>1-1</td>
      <td>1-2</td>
      <td>1-3</td>
      <td>1-4</td>
    </tr>
    <tr>
      <td>2-1</td>
      <td>2-2</td>
      <td>2-3</td>
      <td>2-4</td>
    </tr>
    <tr>
      <td>3-1</td>
      <td>3-2</td>
      <td>3-3</td>
      <td>3-4</td>
    </tr>
    <tr>
      <td>4-1</td>
      <td>4-2</td>
      <td>4-3</td>
      <td>4-4</td>
    </tr>
  </tbody>
</table>

＆＃13;

通过上面的示例，您基本上告诉jQuery定位所有td元素，并将您的类添加到每个元素中。但是，这会将类应用于DOM中的所有td元素。如果要仅将类应用于特定表的元素，可以使用：

$('.parent-class').find('td').addClass('your-class');

您可以将父类添加到<tbody>的{{1}}元素中。这样你find匹配的所有元素。

使用相同的类名命名整个列

2 个答案: