jquery - 如何在新元素的jquery中获取第n个孩子

Question

我已经使用 jquery 创建了表行：

var tableRow = $("<tr>").append($("<td>").text("one"))
                        .append($("<td>").text("two"))
                        .append($("<td>").text("three"));

现在我将它添加到文档中的表格中：

$("#table_id").append(tableRow);

接下来我要做的是在上面创建的 tableRow 的一些单元格上设置点击事件。我想为此目的使用第 n 个子选择器。但是，从文档看来，它似乎可以与一些选择器一起使用，例如：

$("ul li:nth-child(2)")

但是现在我需要使用 :nth-child()一个变量tableRow。这怎么可能？

Answer 1

我想为此目的使用第 n 个子选择器。

在这种情况下，您可以使用.find()

cell = tableRow.find(':nth-child(2)');
cell.on('click', function() {
    ...
});

Answer 2

您可以将.find()与nth-child一起使用

tableRow.find('td:nth-child(2)')

或者在这种情况下，您可以使用.children()，这可能会更好

tableRow.children('nth-child(2)')

Answer 3

试试.eq()喜欢

 $("#table_id tr td:eq(1)")

或者您可以直接从 tableRow 调用

$(tableRow + "tr td:eq(1)")

Answer 4

您动态创建了元素，因此您必须使用以下结构，如果它是静态创建的（即：在 HTML 中创建，您可以使用您提到的 ul）

$('#table_id').find(":nth-child(2n)")

演示