Javascript .empty（）.append（）和.html（）之间有什么区别？

使用jQuery，使用以下各项之间的性能差异是什么：

$('#somDiv').empty().append('text To Insert')

及

---

？

.html将覆盖DIV的内容

.append将添加到DIV的内容中。

简单地说：

$('#somDiv').append('blabla')

工作原理如下：

<div id='somDiv'>some text</div>

一些文本

变成：

<div id='somDiv'>some textblabla</div>

一些文本blabla

innerHTML将替换内容，因此它变成：

<div id='somDiv'>blabla</div>

blabla

$（'#somDiv'）.html（value）

相当于

$（'#somDiv'）.empty（）.append（value）

来源：。

正确的语法是

$("#somDiv").html("<span>Hello world</span>");

$（“#somDiv”）.html（“你好世界”）；

jQuery中

append（）

和

html（）

之间的区别

.append（）

和

.html（）

是jQuery中最有用的方法。但是它们之间有很大的不同，

.append（）

为现有的添加了一些价值。其中

.html（）

执行相同的操作，但它首先删除旧值

以下是一个例子：

<ul id="test">
<li>test</li>
</ul>

此jQuery的输出将是：

<ul id="test">
<li>test</li>
<li>test1</li>
</ul>

此脚本的输出将是：

<ul id="test">
<li>test1</li>
</ul>

测试1

---

在本例中，

.append（）

添加一个额外的

，无论

.html（）

是否用新的删除旧的。这是jQuery中

.append（）

和

.html（）

之间的主要区别。

理解jQuery中提供的扩展的含义和功能

$('#somDiv').empty().append('text To Insert')

--上面的代码将首先清除div id标记内容，然后将文本附加到目标div：

$('#somDiv').html('text To Insert')

---

--上面的代码用html文本替换div标记文本：

append是否使用DOM？但是innerHTML没有？请注意，我已经将empty（）函数包含到该append中，它像.html一样被覆盖。.append比.html快吗？@J-P：公平地说，从时间戳来看，OP似乎对这个问题进行了大量的编辑，从打字错误到合理的修改。太好了！这正是我想要的。我希望答案能更简洁和切中要害。我已经更新了我的原始帖子，加入了empty（）函数，使它们的行为相同。它们在结果上完全相同，但innerHTML在大文件上可能会更快，因为它只使用本机函数，这仅仅是一个调用。是。追加快于。html吗？我已经更新了我的原始帖子。现在有什么区别？（谢谢）从功能上讲，现在没有什么区别了。is.append比.html快吗？@AppleTrue:慢一点更新，伙计！；）我已经更新了您最新问题的答案。…

.empty（）.append（…）

将稍微快一点，因为

.html（…）

本质上是相同内容的包装器。为了提高速度，不要使用

.empty（）.append（…）

，因为即使在几千次调用中，您也不会注意到差异，这会让阅读您的代码的人感到困惑。jQuery文档会让您相信，如果您试图添加现有的jQuery、元素、数组，或者不能使用

.html

的文本，因为它说它只接受

htmlString

或

函数

。但是它确实在内部调用

.empty（）.append（）

，并将现有的jQuery传递给它，这样做是可行的。您可以根据答案继续更改问题。你真正的最终问题是什么？正如你所写的，没有功能上的区别。如果你关心速度，你应该在你的问题中说一些关于速度的话。-1用于更改你的根本问题并使许多答案无效。-1用于备份Stefan，并且因为我不关心我是否会失分。人们可能会假设

html（）

由

innerHTML

和

append（）支持

由

appendChild（）

支持，在这种情况下，浏览器需要做什么以及在序列化/反序列化过程中可能丢失哪些信息存在差异。

<ul id="test">
<li>test1</li>
</ul>

$('#somDiv').empty().append('text To Insert')

$('#somDiv').html('text To Insert')