Quiero clonar a los hijos de #secret_tr
en el .table
tbody
<table class="table"> <thead> <tr> <th>Key</th> <th>Value</th> <th></th> </tr> </thead> <tbody> </tbody> </table> <div id="secret_tr" style="display:none;"> <div> <table> <tbody> <tr> <td>Foo</td> <td>Bar</td> <td> </td> </tr> </tbody> </table> </div> </div>
Esto no funciona aparentemente:
var template = $("#secret_tr").children().clone(); var tr = template.find("table tbody tr"); $("table.table tbody").append(tr);
Sin embargo, si ejecuto esta línea en su lugar, los td
s se agregan, excepto que ahora me falta el tr
:
$("table.table tbody").append(tr.children());
Esta costura para trabajar. Creo una referencia a la plantilla. Y con una referencia al <tr>
creo un clon del elemento. Este clon se puede agregar <tbody>
.
var template = $("#secret_tr"); var tr = template.find("table tbody tr").clone(); $("table.table tbody").append(tr);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <table class="table"> <thead> <tr> <th>Key</th> <th>Value</th> <th></th> </tr> </thead> <tbody> </tbody> </table> <div id="secret_tr" style="display:none;"> <div> <table> <tbody> <tr> <td>Foo</td> <td>Bar</td> <td> </td> </tr> </tbody> </table> </div> </div>