jquery插入元素

使用 jQuery 插入元素的方法

append()
将内容插入到目标元素的内部末尾。

$("#target").append("<div>新元素</div>");

prepend()
将内容插入到目标元素的内部开头。

$("#target").prepend("<div>新元素</div>");

after()
将内容插入到目标元素的外部后面（同级）。

$("#target").after("<div>新元素</div>");

before()
将内容插入到目标元素的外部前面（同级）。

$("#target").before("<div>新元素</div>");

html()
替换目标元素内部的全部内容。

$("#target").html("<div>新内容</div>");

text()
插入纯文本内容（自动转义 HTML 标签）。

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

动态创建元素并插入

可以结合 DOM 元素创建与插入方法：

var newElement = $("<div>", {
  class: "dynamic-class",
  text: "动态创建的元素"
});
$("#target").append(newElement);

插入多个元素

支持一次性插入多个元素或 HTML 字符串：

$("#target").append(
  "<div>元素1</div>",
  "<div>元素2</div>",
  document.createElement("div")
);

链式操作

jQuery 方法支持链式调用：

$("#target")
  .append("<div>元素A</div>")
  .addClass("updated");