javascript - 克隆一个 div 并替换子元素

Question

我有一个包含以下内容的 div：

<div class="payment-form napthe">
    <table>
        <tbody>
            <tr>
                <td><label>Mã thẻ&lt;/label></td>
                <td><label>Serial</label></td>
            </tr>
            <tr>
                <td><input type="text" class="prepaidcard_code"></td>
                <td><input type="text" class="prepaidcard_serial"></td>
            </tr>
            <tr>
                <td colspan="2"><span class="result">Sai định dạng query</span></td>
            </tr>
       </tbody>
   </table>                         
</div>

我想使用 jQuery 克隆这个 div，但使最后一个元素的文本为<tr><td>...</td></tr>空。

我想要这样克隆后的结果：

<div class="payment-form napthe">
    <table>
        <tbody>
            <tr>
                <td><label>Mã thẻ&lt;/label></td>
                <td><label>Serial</label></td>
            </tr>
            <tr>
                <td><input type="text" class="prepaidcard_code"></td>
                <td><input type="text" class="prepaidcard_serial"></td>
            </tr>
            <tr>
                <td colspan="2"><span class="result"></span></td>
            </tr>
       </tbody>
   </table>                         
</div>

Answer 1

尝试

var cloned = $('.payment-form.napthe').clone();
cloned.find('.result').empty(); // or .find('tr:last td span').text(''); 

参考

http://api.jquery.com/?s=%3Alast

http://api.jquery.com/text/

http://api.jquery.com/empty/

Answer 2

您应该发布您已经尝试过的内容...

无论如何，这应该工作

var $clone = $('.payment-form.napthe').clone();
$('.result', $clone).empty();

Answer 3

尝试：

var clone = $(".payment-form.napthe").html();

$("#output-div").html(clone); // output the cloned HTML somewhere
$("#output-div tr:last-child span").html(""); // empty contents of span of last <tr>

如果你需要做多个克隆，你也可以这样做：

$("#output-div").append(clone);

#output-div 只是我为代表您要放置克隆的空间而编造的东西。可能是这样的body