jquery替换html内容

使用 jQuery 替换 HTML 内容的方法

替换整个元素内容

使用 html() 方法可以替换选定元素的内部 HTML 内容。该方法会完全覆盖原有内容。

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

替换文本内容

如果只需要替换纯文本而不解析 HTML，可以使用 text() 方法。

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

替换元素本身

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

$("#oldElement").replaceWith("<div id='newElement'>新元素</div>");

替换多个元素

jQuery 选择器可以匹配多个元素，所有匹配元素都会被替换。

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

使用回调函数动态替换

html() 和 text() 方法接受回调函数，可以基于原有内容生成新内容。

$(".dynamicContent").html(function(index, oldHtml) {
    return oldHtml + " 新增内容";
});

注意事项

• 使用 html() 方法会执行其中的脚本标签，可能存在安全风险
• replaceWith() 会移除原有元素的所有事件处理程序和数据
• 替换操作会立即生效，不需要额外的 DOM 更新操作