appendChild
和 append
在 JavaScript 中都是用来向 DOM 中添加元素的方法,但它们之间存在一些差异:
appendChild
appendChild 方法是 DOM API 的一部分,用于将一个节点作为最后一个子节点添加到指定父节点中。
appendChild 只能接收一个节点作为参数,如果尝试传入非节点(如字符串),将会抛出错误。
appendChild 方法将返回被添加的节点。
使用示例:
const parentElement = document.getElementById('parent');
const newElement = document.createElement('div');
parentElement.appendChild(newElement); // 在parent元素中添加一个新的div作为子节点
append
append 方法是一个较新的 DOM API,它允许你同时向父节点添加多个子节点或字符串。
append 可以接受任意数量的参数,参数可以是 DOM 节点或者是文本。这使得它比 appendChild 更灵活。
append 不会返回任何值。
使用示例(与你提供的代码类似)
const parentElement = document.getElementById('parent');
const newElement = document.createElement('div');
const textContent = 'Hello, World!';
parentElement.append(newElement, textContent); // 在parent元素中添加一个新的div和文本'Hello, World!'作为子节点