jquery添加内容

使用 jQuery 添加内容的方法

append() 方法

append() 方法在选定元素的内部末尾插入内容。
示例代码：

$("#targetElement").append("<p>这是追加的内容</p>");

prepend() 方法

prepend() 方法在选定元素的内部开头插入内容。
示例代码：

$("#targetElement").prepend("<p>这是前置的内容</p>");

after() 方法

after() 方法在选定元素之后插入内容（同级）。
示例代码：

$("#targetElement").after("<div>这是之后插入的内容</div>");

before() 方法

before() 方法在选定元素之前插入内容（同级）。
示例代码：

$("#targetElement").before("<span>这是之前插入的内容</span>");

html() 方法

html() 方法替换选定元素的全部内容。
示例代码：

$("#targetElement").html("<h1>替换后的标题</h1>");

text() 方法

text() 方法设置或返回选定元素的文本内容（不解析HTML标签）。
示例代码：

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

动态内容添加示例

结合事件触发动态添加内容：

$("#btnAdd").click(function() {
    $("#container").append("<li>新列表项</li>");
});

注意事项

• 插入内容可以是HTML字符串、DOM元素或jQuery对象。
• 使用appendTo()或prependTo()可反转操作主体与内容的位置。
• 频繁操作DOM可能影响性能，建议批量处理或使用文档片段优化。