jquery替换html内容

jQuery 替换 HTML 内容的方法

使用 jQuery 替换 HTML 内容可以通过多种方式实现，具体取决于需求。以下是常见的几种方法：

替换元素内部内容

使用 .html() 方法可以替换选中元素的内部 HTML 内容：

$("#targetElement").html("<p>新的HTML内容</p>");

替换元素文本内容

如果需要仅替换文本而不解析 HTML，可以使用 .text() 方法：

$("#targetElement").text("纯文本内容");

替换整个元素

使用 .replaceWith() 方法可以替换整个元素（包括元素本身）：

$("#oldElement").replaceWith("<div id='newElement'>替换内容</div>");

替换多个元素

可以通过选择器选中多个元素进行批量替换：

$(".classToReplace").html("统一替换内容");

使用回调函数替换

.html() 和 .text() 方法支持回调函数进行动态替换：

$(".items").html(function(index, oldHtml) {
    return "第" + (index+1) + "项：" + oldHtml;
});

注意事项

• 使用 .html() 会解析字符串中的 HTML 标签
• 使用 .text() 会自动转义 HTML 标签，将其作为纯文本显示
• 替换操作会移除原有内容的所有事件处理程序和数据
• 对于大量 DOM 操作，建议先分离操作再重新插入以提高性能