如何使用 jQuery（或其他）更改 Html 标签？答案

【问题标题】：How to change Html tags using jQuery (or anything else)?如何使用 jQuery（或其他）更改 Html 标签？
【发布时间】：2012-03-20 11:43:26
【问题描述】：

如何更改：

<p class="myClass">Lorem Ipsum (and maybe other nested tags)</p>

进入：

<code class="myClass">Lorem Ipsum (and maybe other nested tags)</code>

这是一个离线作业。这只是一个更新，但我需要将数千个 ps 更改为 codes。

【问题讨论】：

您是说要永久更新您的源 html 吗？大多数 IDE 都允许您在项目中的所有文件中进行查找和替换，Notepadd++ 等工具也是如此。
为什么您需要或计划在客户端在线甚至离线进行这些更改..？
@nnnnnn 是的，这是一个永久更新。 Find-replace 会找到 并将其替换为<code class="myClass">；但是结尾 呢（显然有结尾段落与 不对应。
@hornetbzz 这是我需要克服的 iBooks 中的一个错误（Html 文件将成为 ePubs 的来源）。

【解决方案1】：

可以使用contents()获取元素的子元素（包括文本节点），然后结合unwrap()和wrapAll()：

$("p.myClass").contents().unwrap().wrapAll("<code class='myClass'></code>");

更新：如果您有多个  元素，则必须使用 each() 对其进行迭代，以避免在单个 <code> 元素中重新设置它们的父级：

$("p.myClass").each(function() {
    $(this).contents().unwrap().wrapAll("<code class='myClass'></code>");
});

【讨论】：

感谢您的回复。我不熟悉 Jquery；我刚刚尝试过$(document).ready(function() { $("p.code").contents().unwrap().wrapAll("<code class='code'></code>"); });，但它的作用是将所有s 中的文本放入一个<code class="myClass">。换句话说，它将 ...  的第一次出现替换为<code class="myClass"> (the contents of all s that have a class="myClass") </class>。
是的，如果您有多个  元素，这确实会发生。解决方案是遍历它们，请参阅我更新的答案。