javascript - 改变 jQuery 解析的 html

Question

好的，我有这个 html 结构

<table id="list">
    <thead><tr><th>Name</th></tr></thead>
    <tbody>
         <tr><td class="container"><input class="myname" type="text" value="Roi" /></td></tr>
         <tr><td class="container"><input class="myname" type="text" value="Sam" /></td></tr>
    </tbody>
</table>

我想通过电子邮件发送此表，这不会有问题，我面临的问题是，如果我完全按照原样发送它，那么它有点错误，因为有一个 input 元素

所以我的计划是我将仅用纯值替换输入，我可以使用以下代码来实现这一点:

$( ".myname" ).each(function( index ) {
    var name = this.val();
    this.closest(".container").html(name);
});

如果我们谈论的是实际页面，那么这会起作用，但我不想改变实际页面，所以我想出了这个:

var html = jQuery("#list").html();
html = jQuery.parseHTML(html);

现在，我如何在 html 变量中执行相同的操作？

Answer 1

我设法使用以下内容得到了我想要的东西

jQuery('#send').click(function() {
    var html = jQuery("#list").html();
    jQuery(html).find('.container').each( function() {
        var oldcontent = jQuery(this).html();
        var newcontent = jQuery(this).children(".myname").val();
        html = html.replace(oldcontent, newcontent);
    });
});

我想我可以将它用作 string不需要 parseHTML它并使用 replace()功能。 感谢 Arun 的回答，我无法使用他的答案，因为在某些情况下 <td> 中有多个元素。和replaceWith这不是最好的方法，因为它只是替换单个元素。

我仍然愿意寻求更好的答案，我觉得我的答案有点作弊，并且假设不会有相同的名字。

但是如果 .myname 则可以防止出现同名的错误。类有自己的 ID。