如何在jQuery中更改包装标签？

Question

以下代码行会将p代码更改为div代码：

$('p').contents().unwrap().wrap('<div />');

以下是问题：

这也会将任何内部标签转换为div s！

示例：

采用以下HTML：

<p>abc<a>121</a>cba</p>

上面运行我的代码给了我这个：

<div>abc</div>
<div><a>121</a></div>
<div>cba</div>

但我想实现这个目标：

<div>abc<a>121</a>cba</div>

我能做些什么来实现这一目标，为什么当我不这样做时呢？

Answer 1

你需要

$('p').wrap('<div />').contents().unwrap();

演示：Fiddle

您的代码错误，因为

1. $('p').contents().unwrap()将删除p元素并将所有子节点添加到p元素的父元素，然后该集合包含3个元素。
2. .wrap('<div />');将使用div标记
包装所有三个元素

另一种可能的解决方案是

$('p').contents().unwrap().wrapAll('<div />');

演示：Fiddle

Answer 2

你可以试试这个

$('p').replaceWith($('<div>'+ $('p').html()+ '</div>'));