js实现prependchild

实现 prependChild 的方法

在 JavaScript 中，DOM 操作没有直接提供 prependChild 方法，但可以通过现有方法实现类似功能。以下是几种实现方式：

使用 insertBefore 方法

const parent = document.getElementById('parent');
const newChild = document.createElement('div');
const firstChild = parent.firstChild;

parent.insertBefore(newChild, firstChild);

使用 prepend 方法（现代浏览器支持）

const parent = document.getElementById('parent');
const newChild = document.createElement('div');

parent.prepend(newChild);

自定义 prependChild 函数

function prependChild(parent, child) {
    if (parent.firstChild) {
        parent.insertBefore(child, parent.firstChild);
    } else {
        parent.appendChild(child);
    }
}

// 使用示例
const parent = document.getElementById('parent');
const newChild = document.createElement('div');
prependChild(parent, newChild);

使用 insertAdjacentElement 方法

const parent = document.getElementById('parent');
const newChild = document.createElement('div');

parent.insertAdjacentElement('afterbegin', newChild);

注意事项

• prepend 方法是较新的 API，兼容 IE 等旧浏览器时需要 polyfill
• insertBefore 是传统的 DOM 方法，兼容性最好
• 自定义函数可以封装成通用工具函数方便复用

以上方法都能实现在父元素开头插入子节点的效果，可根据项目需求和浏览器兼容性要求选择合适的方式。