如何克隆元素并更改其DOM类型

Question

我想克隆一个DOM元素及其所有子元素（包括数据和侦听器），但我希望生成的克隆具有不同的DOM类型。

E.g。我想转换：

<td>
 <p class="pclass">
  Hello
 </p>
 <p class="pclass">
  World!
 </p>
</td>

到包含以下内容的新元素

<div>
 <p class="pclass">
  Hello
 </p>
 <p class="pclass">
  World!
 </p>
</div>

注意：我已经有了答案，但因为它可能会使其他人感到不安，而且答案并不完美但足够，我创造了这个主题。

Answer 1

以下jQuery脚本将完成这项工作：

var oldElement = $(your selector here);
var newElement = $('<my new HTML tag>').append($(oldElement).contents().clone(true, true));

此脚本保留元素 children 数据和事件侦听器（参见clone（true，true））。 此脚本不会保留元素本身数据和事件侦听器。

注意：有人建议补充以保留原始元素数据和事件监听器，这可能会令人感到不安。这里提出了一个答案的开头：https://stackoverflow.com/a/2207117/2227298