在同一页面上选择多个表答案

【问题标题】：Selecting Multiple Tables On Same Page在同一页面上选择多个表
【发布时间】：2013-01-02 01:17:03
【问题描述】：

我在同一页面上有多个表格。我正在尝试编写 jQuery 代码，该代码将单独计算页面上每个表的行数，并根据行数是偶数还是奇数，对每个单独的表应用不同的 CSS。

使用 jQuery 的 .each 函数，我可以选择每个表。但是我需要一种方法来使用“this”关键字来计算单个表中的行数。如果只有一张桌子我可以使用

var amountOfRows = $(".data  tbody  tr").length;

但是由于有多个表，我需要一些包含“this”关键字的代码来单独获取每个行的长度。

所以我真的只是想知道如何使用“this”关键字来读取页面上每个表格的行数。

这是一个基本的 jsfiddle：http://jsfiddle.net/49jNn/1/

这是我的 HTML 代码的简化版本，我有 2-4 个页面。

<table class="data">
    <thead>
        //head row
    </thead>
    <tfoot>
        //footer row
    </tfoot>

    //I want the number of these rows
    <tr>
        //multiple <td>
    </tr>
    <tr>
        //multiple <td>
    </tr>
    <tr>
        //multiple <td>
    </tr>
</table>

到目前为止，我的 jQuery 代码能够遍历页面上的 # 个表。

$('table').each(function() {
    alert("table");
});

【问题讨论】：

标签： jquery html html-table this

【解决方案1】：

你可以使用$(selector, context);

$('tbody tr', this).length;

或find方法：

$(this).find('tbody tr').length;

【讨论】：

【解决方案2】：

在你的每个选择器中，你可能想尝试这样的事情，

$('table').each(function(e, table) {
    console.log(['Table length', $(table).find('tbody tr').length]);
});

其中 e 将是索引，table 是每个语句中的当前表。

$(table) 将获取 javascript 对象并将其作为 jQuery 对象引用，这将允许您使用 .find('tbody tr') 获取该表中的行。

【讨论】：