【问题标题】：How do I change an element (e.g. h1 -> h2) using jQuery / plain old javascript?如何使用 jQuery / 普通旧 javascript 更改元素（例如 h1 -> h2）？
【发布时间】：2008-10-27 16:18:21
【问题描述】：

当然，存在与文档有效性相关的一系列可能的错误，但是当将段落 (p) 更改为 address 元素时，我的直接绊脚石就出现了。我目前的方法是（或多或少）：

var p = $('p#test');
p.replaceWith('<address>' + p.html() + '</address>');

但是对于这种特定情况来说失败了；它适用于 p -> blockquote 或 h2 -> h3。 Firebug 表明由于某种原因，文档中添加了一个自动关闭元素 (<address/>)。

任何人都可以发现错误或提出替代方法吗？

【问题讨论】：

这对我来说在最小的页面上效果很好。你的页面验证了吗？
它在加载时验证，是的。就我正确阅读 HTML 规范而言，它也会在更改后验证（即地址可以在任何上下文中替换 p）。
以防万一您想知道出了什么问题：p.html() 获取第一个匹配元素的 html 内容。您必须使用 p.each(...); 使用这种方法；

标签： javascript jquery

【解决方案1】：

var p = $('p#test');
var a = $('<address>').
    append(p.contents());
p.replaceWith(a);

您的解决方案会受到各种可怕的 HTML 转义问题和可能的注入攻击。

【讨论】：

Daniel，感谢您的回答，但这不是假设地址元素已经存在吗？想象一下身体只由“
stuff
”组成，我希望它是“
stuff
”
不，语法 $('
') 创建一个新的地址元素，然后可以使用它来替换 p。但是请注意，我刚刚对我的原始帖子进行了更正。
哇 - 这对我来说是一个新的 jQuery :) 谢谢，Daniel - 像梦一样工作。

【解决方案2】：

您可以在标题周围使用占位符：

标题

然后使用 JavaScript DOM 为 innerHTML 属性创建新值。

【讨论】：

为什么这被否决了？在不解释原因的情况下对这样的事情投反对票是没有帮助的......
是覆盖整个还是简单地用新字符串覆盖目标？
它被否决了，因为：1）它没有回答问题。该问题询问如何用另一个标签替换现有标签，但保留原始标签的内容。此代码替换标签及其内容。 2）它没有充分的理由需要一个额外的占位符标签。 3) 它不会转义tag 或title，因此这些变量可能包含HTML 标记，这些标记将被解析并注入到页面中。这可能是注入攻击的载体。基本上，这个答案是一个坏分形。