jQuery如何使用.find

Question

<table id="myTable">
    <tr id="myRow1">
        <td>hi</td>
        <td>hello</td>
        <td>comeon</td>
    </tr>
</table>

1. 在上面的场景中，

   之间有什么区别

   $("#myTable").find('tr')

   和

   $("#myTable").find('tr')[0]或$("#myTable").find('tr').get(0)？

2. 同样给出了$("#myTable").find('tr')[0]，如何获得td下的{{1}}个数？

感谢。

Answer 1

除非您真的需要，否则不应使用[i]或.get(i)语法，这些是访问jQuery对象中底层元素的方法。

jQuery对象被设计为元素的包装。

.find()是一个jQuery函数，它只适用于jQuery对象。如果你提取底层元素，它不再是一个jQuery对象，只是一个常规元素，所以你不能在它上面使用.find()。

如果只需要第一个元素，那么使用jQuery过滤器来获取它，将结果保留为jQuery对象。此外，如果您先单独使用该部件，则只需使用.find()。

这些是相同的：

$('#myTable').find('tr:first').find('td');
$('#myTable tr:first td');

Answer 2

$("#myTable").find('tr')

将查询表tr中的所有#myTable元素，并将其返回到 jQuery包装集。

$("#myTable").find('tr')[0]

将查询同一个表中的所有tr个元素，但返回第一个 DOM元素（不是jQuery对象）

$("#myTable").find('tr').get(0)

与上述完全相同。

正如我上面提到的，$("#myTable").find('tr')[0]会返回DOM element。你需要原生的Javascript＆amp; DOM用于获取所有<td>个节点。使用jQuery执行它看起来像

$("#myTable").find('td').length

将返回整个表中<td>个节点的数量。

Answer 3

  

同样给出$("#myTable").find('tr')[0]，我如何得到它下面'td'的数量？

由于您引用了DOM元素use the native cells property。

var len = $("#myTable").find('tr')[0].cells.length;

Answer 4

Comeonman，如果你想让$("#myTable").find('tr')[0].find('td')工作，请使用：

$($("#myTable").find('tr')[0]).find('td') // should work

$(an_obj)会将an_obj转换为jquery对象

Answer 5

使用jQuery选择器时，您将获得一组包装的DOM元素，而不仅仅是一个简单的数组。当您使用[0]选择单个元素时，您将丢失包装器，并且不能再对该元素使用jQuery方法。如果要检索表中的第一行，可以使用：first selector。

$("#mytable").find('tr:first')

这将为您提供一个包装集，该集合仅包含表中的第一个tr元素。要获取该tr中的td元素数，可以使用size（）方法。

$("#mytable").find('tr:first').find('td').size()

我现在没有时间对此进行测试，但看起来不错。如果它对您不起作用，请告诉我，我会根据需要进行更新。

Answer 6

1. 区别在于，在第一个选择器中您实际选择了<tr>中的所有#myTable元素，而在第二个和第三个中，您只是选择了第一个索引在同一个数组中，它始终是一个<tr>元素（尽管它可能有一个n个子项

2. $("#myTable").find('tr').eq(0).children('td').length

请注意，在＃2中，您只需要选择{{1}中第一个 <td>元素的<tr>个孩子选择器。选择表格中所有$("#myTable").find('tr')元素的最简单方法是：<td> ...如果这是您尝试做的事情。