Question

我知道使用jQuery来设置奇数/偶数表单元格，但我如何设置第3，第4或第5个元素的样式？

<table width="300" border="0" cellspacing="0" cellpadding="0" id="Weekdays">
<thead>
  <tr>
    <td>Week Day</td>
    <td>Short Name</td>
  </tr>
</thead>
<tbody>
  <tr>
    <td>Monday</td>
    <td>Mon</td>
  </tr>
  <tr>
    <td>Tuesday</td>
    <td>Tue</td>
  </tr>
  <tr>
    <td>Wednesday</td>
    <td>Wed</td>
  </tr>
  <tr>
    <td>Thursday</td>
    <td>Thr</td>
  </tr>
  <tr>
    <td>Friday</td>
    <td>Fri</td>
  </tr>
  <tr>
    <td>Saturday</td>
    <td>Sat</td>
  </tr>
  <tr>
    <td>Sunday</td>
    <td>Sun</td>
  </tr>
</tbody>
</table>

我该怎么做？

Answer 1

使用eq（）：

$('td:eq(5)').css('background','red');

// OR:

$('td').eq(5).css('background','red');

这两个例子都会将第6个TD元素的背景用红色着色。

Answer 2

你可以使用.slice()从字面上获得一个元素范围（虽然我不是100％肯定你正在追求的），如下所示：

$("td").slice(2, 5).css("color", "red");

You can give it a try here这将选择以下元素：

<td>Monday</td>
<td>Mon</td>
<td>Tuesday</td>

因此，我不确定元素here's a version using rows的含义是什么，只需将"td"替换为"tr"即可。

Answer 3

$('#Weekdays tbody tr').each(function(i) {
   // Modify the style of element i here
});

Answer 4

$('tr:nth-child(5)').function();

你有很多关于CS3 :) http://www.w3.org/TR/css3-selectors/

的事情

Answer 5

要从任何元素的第n个孩子到最后一个孩子选择孩子，只需使用：

$("#mytable td").slice(n).hide()

如何使用jQuery设置第3，第4或第5个表格单元格

5 个答案: