jquery - 如何使用 JQuery 在某个类的最后一行之后插入行？

Question

给出下表:

    <table>
        <tr class="one"><td>Hello</td></tr>
        <tr class="one"><td>Hello</td></tr>
        <tr class="one"><td>Hello</td></tr>
        <tr class="two"><td>World</td></tr>
        <tr class="two"><td>World</td></tr>
    </table>

是否可以使用JQuery在第3行和第4行之间插入一行(当类从“一”变为“二”时)？如果是这样，怎么办？

我想也许以某种组合使用 insertAfter() 和 .last()...

Answer 1

$('table tr:nth-child(3)').after('<div>....</div>');

这每次都会在第三行之后插入一些内容!

$('table .one:nth-child(3)').after('<div>....</div>');

这将在第三个 .one 类之后插入一些内容。

$('table .two:nth-child(1)').before('<div>....</div>');

这将插入到第一个 .two 类之前。这意味着它将介于 .one 和 .two 之间。

编辑

根据我对您评论的理解，您希望在最后一个 .one tr 之后插入一个元素。

这可以通过使用以下内容轻松完成:

$('.one').last().after('<div>...code goes in here...</div>');

或者

$('.one:last-child').after('<div>...</div>');