jQuery方法操作元素的创建，添加，删除_jquery新增删除页面元素 csdn-CSDN博客

该博客主要介绍了jQuery中元素的创建、添加和删除操作。添加操作包括内部添加（append、prepend）、外部添加（after、before）以及添加内容（innerText、innerHtml）；删除操作有remove、empty和html清空内容等，还说明了不同操作产生的元素关系。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

创建

//动态创建了一个p标签
$("<p></p>");

1.element.append("内容")

将内容放到匹配元素内部的最后面，类似原生appendChild

//创建一个新元素
var div = $("<div>创建的一个新元素</div>");
//找到id为big的元素，将div放入
$("#big").append(div);

2.element.prepend("内容")

将内容放到匹配元素内部的最前面

//创建一个新元素
var div = $("<div>创建的一个新元素</div>");
//找到id为big的元素，将div放入最前面
$("#big").prepend(div);

1.element.after("内容")

把内容放在目标元素的后面(即并列)

//在div的后面添加一个P标签
$("div").after("<p>添加的新元素</p>")

2.element.before("内容")

把内容放在目标元素的前面(即并列)

//在div的前面添加一个P标签
$("div").after("<p>添加的新元素</p>")

1）内部元素生成之后是父子关系

2）外部元素生成之后是兄弟关系

1.innerText()

innerText 可获取或设置指定元素标签内的文本值，从该元素标签的起始位置到终止位置的全部文本内容(不包含html标签产生的效果)

$("p"),innerText("我是新添加的文本")

2.innerHtml()

几乎所有的元素都有innerHTML属性，它是一个字符串，用来设置或获取位于对象起始和结束标签内的HTML

$("ul"),innerHTML("<li>我是新设置的li标签</li>")

1.element.remove()

删除匹配的元素（本身）

//删除这个div
$("div").remove;

2.elemen.empty()

删除匹配元素集合中的所有子节点

//删除这个div下的所有子节点
$("div").empty;

3.element.html(" ")

清空匹配的元素内容

//清空div的内容
$("div").html(" ");

html("")于empty等价，只不过HTML可以设置内容