jquery - 将 HTML 标签替换为新标签

Question

如何使用 jQuery 将 html 标签替换为新标签？

我有许多 table 标记，并且我想替换包含类的特定表。它的所有子节点也应该被替换。

<table class='replace_this'>
    <tr>
        <td>
            All table, tr, and td tag are replaced with div tag
        </td>
    </tr>
</table>

应改为:

<div class='replace_this'>
    <div>
        <div>
            All table, tr, and td tag are replaced with div tag
        </div>
    </div>
</div>

Answer 1

你必须从内到外开始:

$('.replace_this td').each(function() {
    $(this).replaceWith(function() {
        return $('<div>' + this.innerHTML + '</div>')
    })
});

$('.replace_this tr').each(function() {
    $(this).replaceWith(function() {
        return $('<div>' + this.innerHTML + '</div>')
    })
});

$('table.replace_this ').each(function() {
    $(this).replaceWith(function() {
        return $('<div class="replace_this">' + this.innerHTML + '</div>')
    })
});

Example