以'.append() 方法和.appendChild() 方法之间的区别 - JavaScript

在JavaScript中，.append()方法和.appendChild()方法都用于向DOM（文档对象模型）中添加元素或节点。虽然这两种方法在实现上有些不同，但它们的基本功能是相同的。

.append()方法

.append()方法是在jQuery的基础上引入的方法，可以将新元素附加到现有元素中。可以一次传递多个参数，每个参数将被附加到元素中。 例如：

$('#myDiv').append('<p>Hello world!</p>');

在上面的示例中，一个包含<p>标记的新段落将附加到id为“myDiv”的元素中。

.append()方法可以附加HTML字符串，DOM元素和jQuery对象。

.appendChild()方法

.appendChild()方法是原生JavaScript方法，它是把一个新的子节点附加到指定节点的子节点列表的最后面。 例如：

var newDiv = document.createElement('div'); 
document.getElementById('myDiv').appendChild(newDiv);

在上面的示例中，我们首先创建了一个新的<div>元素，然后将其附加到id为“myDiv”的现有元素中。

.appendChild()方法只能接受 DOM元素对象，不能接受其它类型的参数。

区别

1. 实现方式：.append()方法是使用jQuery库中的方法，而.appendChild()方法是原生JavaScript方法。
2. 传参方式：.append()方法可以一次传递多个参数，.appendChild()方法只能接受 DOM元素对象。
3. 返回值：.append()方法返回jQuery对象，.appendChild()方法返回添加的节点。

无论使用哪种方法来添加节点，您最终都会达到相同的结果：DOM中有新的元素或节点。选择使用哪种方法主要取决于您的项目和代码库的需求和限制。