使用jQuery获取第二个孩子

$(t).html()

<td>test1</td><td>test2</td>

我想从$(t)对象中检索第二个td。我寻找解决办法，但没有一个对我有效。知道怎么得到第二个元素吗?

当前回答

令人惊讶的是，没有人提到原生JS的方式来做到这一点。

没有jQuery:

只需访问父元素的children属性。它将返回一个由可以被索引访问的子元素组成的实时HTMLCollection。如果你想要第二个孩子:

parentElement.children[1];

在你的情况下，像这样的东西可以工作:(示例)

var secondChild = document.querySelector('.parent').children[1];

console.log(secondChild); // <td>element two</td>

<table>
    <tr class="parent">
        <td>element one</td>
        <td>element two</td>
    </tr>
</table>

你也可以使用CSS3选择器/ querySelector()的组合，并利用:n -of-type()。这种方法在某些情况下可能工作得更好，因为您还可以指定元素类型，在本例中为td:n -of-type(2)(示例)

var secondChild = document.querySelector('.parent > td:nth-of-type(2)');

console.log(secondChild); // <td>element two</td>

其他回答

抓住第二个孩子:

$(t).children().eq(1);

或者，获取第二个子元素<td>:

$(t).children('td').eq(1);

参见儿童和eq的文档。

令人惊讶的是，没有人提到原生JS的方式来做到这一点。

没有jQuery:

只需访问父元素的children属性。它将返回一个由可以被索引访问的子元素组成的实时HTMLCollection。如果你想要第二个孩子:

parentElement.children[1];

在你的情况下，像这样的东西可以工作:(示例)

var secondChild = document.querySelector('.parent').children[1];

console.log(secondChild); // <td>element two</td>

<table>
    <tr class="parent">
        <td>element one</td>
        <td>element two</td>
    </tr>
</table>

var secondChild = document.querySelector('.parent > td:nth-of-type(2)');

console.log(secondChild); // <td>element two</td>

试试这个:

$("td:eq(1)", $(t))

$("td", $(t)).eq(1)

除了使用jQuery方法，您还可以使用<tr>提供给您的本机单元格集合。

$(t)[0].cells[1].innerHTML

假设t是一个DOM元素，您可以绕过jQuery对象创建。

t.cells[1].innerHTML

使用.find()方法

美元(t);(“道明:eq(1)”);

Td:eq(x) // x是要检索的子对象的索引。Eq(1) = 1。 //1表示第二个元素

推荐文章