Question

<table id="table" border="1">
    <tr>
        <td>
            <table border="1">
                <tr>
                    <td>aaa</td>
                </tr>
            </table>
        </td>
    </tr>
    <tr>
        <td>
            <table border="1">
                <tr>
                    <td>bbb</td>
                </tr>
            </table>
        </td>
    </tr>
    <tr>
        <td>
            <table border="1">
                <tr>
                    <td>ccc</td>
                </tr>
            </table>
        </td>
    </tr>
</table>

<span id="append">append</span>   

$('#append').click(function(){
   $('table#table tr').append('<tr><td><table><tr><td>ddd</td></tr></table></tr>');
})

如何仅在第一个元素上使用jQuery的追加功能？当我在这里使用append时，它会附加所有子表。我只想附加第一个子表格。我尝试使用>选择器，但它不起作用。我怎样才能达到这个效果？

LIVE DEMO

Answer 1

试试这个：

$('#append').click(function(){
    $('table#table tr').first().append('<tr><td><table><tr><td>ddd</td></tr></table></tr>');
})

Answer 2

您可以使用first()方法：

$('#append').click(function(){
    $('table#table tr').first().append('<tr><td><table><tr><td>ddd</td></tr></table></tr>');
})

虽然这会使HTML无效..我认为您要追加的是：

<td><table><tr><td>ddd</td></tr></table></td>

JSFiddle

Answer 3

看一下jQuery first-child selector

Answer 4

$("#table table tr:first").after('<tr><td><table><tr><td>ddd</td></tr></table></tr>');

经过测试 Live DEMO

Answer 5

如果我了解您的要求，以下内容应该有效。请注意，我要附加到第一个子表，因为您不能将tr作为tr的直接子项（这就是为什么您最终会使用另一个嵌套table。

$('#append').click(function(){
    $('#table table:first').append('<tr><td><table><tr><td>ddd</td></tr></table></tr>');
})

Updated fiddle

Answer 6

尝试$('table#table tr:first-child')

仅附加第一个元素

6 个答案: