Question

我有一个像这样的标准表结构：

<table id="test">
  <th>...</th>
  <tr><td>one thing</td></tr>
  <tr><td>another</td></tr>
  ...
  ...
</table>

我知道如何克隆整个表格或表格的第n行，但我需要的是整个事情，除了表格的第2，第3，第4等行，换句话说：

<table id="test">
  <th>...</th>
  <tr><td>one thing</td></tr>
</table>

想法好吗？

Answer 1

＆＃34;我知道如何克隆整个表格...＆＃34;

然后这样做，克隆整个表，然后删除你不需要的东西。

选择除第一个孩子以外的所有内容的技巧是使用*+*。 css中的+选择器表示左侧元素旁边右侧的匹配元素。

最后，您可以使用：

var $clone = $('#test').clone().find('tr+tr').remove().end();

$clone将成为您的克隆表，只有第一行。

Answer 2

另一种解决方案是使用以下child filter选择器：:not(:first-child)。但是你有很多其他的解决方案，结合了所有这些选择器。

var $clone = $("#test").clone();
$clone.find("tr:not(:first-child)").remove();    
$("#target").html($clone);

示例：http://jsfiddle.net/rnogdu0L/

$("#but").click(function() {
    var $clone = $("#test").clone();
    $clone.find("tr:not(:first-child)").remove();    
    $("#target").html($clone);
});

td {
    border: 1px solid blue;
}

#source {
    min-height: 20px;
    background: pink;
}

#target {
    min-height: 20px;
    background: yellow;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="source">
    <table id="test">
        <th>do not delete this</th>
        <tr><td>one thing</td></tr>
        <tr><td>another</td></tr>
    </table>
</div>

<div id="target">
</div>
<button id="but">Clone & Delete</button>

Jquery：克隆一个表及其第一行

2 个答案: