如何使用JQuery在特定类的最后一行之后插入一行? [英] How to insert row after last row with a certain class with JQuery?

问题描述

给出下表:

    <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在第三行和第四行之间插入一行(当类从一个"更改为两个"时)?如果是这样，怎么办?

Is it possible to use JQuery to insert a row between the 3rd and 4th rows (when the class changes from "one" to "two")? If so, how?

我正在考虑也许以某种组合使用insertAfter()和.last()...

I'm thinking maybe using insertAfter() and .last() in some combination...

推荐答案

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

每次都会在第三行之后插入内容！

This will insert something after the 3rd row every time!

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

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

This will insert something after the 3rd .one class.

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

这将插入第一个.two类之前.意味着它将在.one&之间. .two.

This would insert before the first .two class. Meaning it would be inbetween .one & .two.

据我对您的评论的了解，您想在最后一个.one tr之后插入一个元素.

From what I understand of your comment, you would like to insert an element after the last .one tr.

可以使用以下方法轻松完成此操作:

This can easily be done by using this:

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

OR

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

这篇关于如何使用JQuery在特定类的最后一行之后插入一行?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！