JS Prepend用法详解及实例演示：DOM操作技巧分享

JS Prepend是一种DOM操作技巧，它是把新元素添加到父元素的开头，可以使用以下两种方法来实现：

使用insertBefore()函数

let parent = document.getElementById('parent');
let newElement = document.createElement("div");
newElement.innerHTML = "This is a new element";
parent.insertBefore(newElement, parent.firstChild);

其中，parent.firstChild表示父元素的第一个子元素，newElement表示新元素，insertBefore()函数的作用是在parent元素中的第一个子元素的前面插入新元素。

使用prepend()函数

let parent = document.getElementById('parent');
let newElement = document.createElement("div");
newElement.innerHTML = "This is a new element";
parent.prepend(newElement);

prepend()函数的作用是在parent元素的开头添加新元素，该函数在IE浏览器不可用，需要使用polyfill.js进行兼容。

实例演示

• 使用insertBefore()函数：

  let parent = document.getElementById('parent');
  let newElement = document.createElement("div");
  newElement.innerHTML = "This is a new element";
  parent.insertBefore(newElement, parent.firstChild);
          

• 使用prepend()函数：

  let parent = document.getElementById('parent');
  let newElement = document.createElement("div");
  newElement.innerHTML = "This is a new element";
  parent.prepend(newElement);
          

以上就是JS Prepend的使用方法，通过这两种方法，我们可以很方便的在父元素的开头添加新元素，从而实现DOM操作。