jQuery - 如何选择表中所有行的最后一列?

时间:2014-05-29 18:37:52

标签: javascript jquery html jquery-selectors

假设我有一个HTML表格如下(使用适当的tr,td标签):

a1 | b1 | c1
a2 | b2 | c2
a3 | b3 | c3
a4 | b4 | c4

<table border="1">
<tr>
    <td>a1</td>
    <td>b1</td>
    <td>c1</td>
</tr>
<tr>
    <td>a2</td>
    <td>b2</td>
    <td>c2</td>
</tr>
<tr>
    <td>a3</td>
    <td>b3</td>
    <td>c3</td>
</tr>
<tr>
    <td>a4</td>
    <td>b4</td>
    <td>c4</td>
</tr>
</table>

我正在尝试选择所有c *行来对它们执行操作。

使用$('td:last')选择器只选择最后一个td标记,即c4。

我尝试了$('tr > td:last')这不起作用。在这种情况下,正确的选择器是什么?

2 个答案:

答案 0 :(得分:13)

:last是一个jQuery选择器,但它只会选择该类型的最后一个元素。您最有可能寻找:last-child

同样,td:first-child会为您提供第一个单元格,而:first会为您提供该类型的第一个元素。

这是一个Fiddle供您查看所有四个示例。

答案 1 :(得分:1)

如上所述,要选择作为其父td的最后一个孩子的每个tr,请改为使用:last-child

$('td:last-child')

:last选择器不起作用的原因是因为它实际上为您提供了DOM中的最后一个元素,该元素匹配选择器中的所有内容,直到它出现的位置:

  • $('td:last')返回最后一个td元素
  • $('tr > td:last')返回上一个tr > td

由于每个td都需要tr > td,因此这两个选择器没有区别。