js实现prepend

prepend 的实现方法

在 JavaScript 中，prepend 用于将一个或多个节点或字符串插入到父节点的子节点列表的最前面。以下是几种实现方式：

使用原生 DOM API

现代浏览器支持原生的 prepend 方法，可以直接调用：

const parent = document.getElementById('parent');
const child = document.createElement('div');
child.textContent = 'New Child';
parent.prepend(child);

兼容旧版浏览器的实现

对于不支持 prepend 的旧浏览器，可以通过 insertBefore 实现：

const parent = document.getElementById('parent');
const child = document.createElement('div');
child.textContent = 'New Child';
parent.insertBefore(child, parent.firstChild);

插入多个节点或字符串

prepend 支持插入多个节点或字符串：

const parent = document.getElementById('parent');
const child1 = document.createElement('div');
child1.textContent = 'Child 1';
const child2 = document.createElement('div');
child2.textContent = 'Child 2';
parent.prepend(child1, child2, 'Text Node');

使用 jQuery

如果项目中已引入 jQuery，可以直接使用其 prepend 方法：

$('#parent').prepend('<div>New Child</div>');

注意事项

• 插入的字符串会被自动转换为文本节点。
• 插入的节点如果已存在于文档中，会被移动到新位置。
• 确保父节点存在且是有效的 DOM 元素。