用原生JS實(shí)現(xiàn)在一個(gè)dom元素后插入新的節(jié)點(diǎn)禁荒？
在js的dom api中有insertBefore()方法 在已知子節(jié)點(diǎn)的前面插入新的子節(jié)點(diǎn)矫夯。
然而并沒有提供insertAfter()方法，在實(shí)際開發(fā)中遇到了這個(gè)問題命咐，自己編寫了一個(gè)insertAfter方法谬运，運(yùn)用現(xiàn)有的dom方法屬性。
/**
* 指定的現(xiàn)有節(jié)點(diǎn)之后插入新的節(jié)點(diǎn)
*
* @param {Node} newNode 需要插入的節(jié)點(diǎn)對(duì)象
* @param {Node} existingNode 現(xiàn)有的節(jié)點(diǎn)
*/
function insertAfter(newNode, existingNode) {
// 獲取現(xiàn)有節(jié)點(diǎn)的父元素
const parent = existingNode.parentNode;
// 如果父元素中的最后一個(gè)子元素 等于 現(xiàn)有的節(jié)點(diǎn)
if (parent.lastChild === existingNode) {
// 把現(xiàn)有節(jié)點(diǎn)放入父元素子節(jié)點(diǎn)后面
// appendChild在子節(jié)點(diǎn)后面追加一個(gè)元素
parent.appendChild(newNode);
} else {
// .nextSibling 該屬性返回指定節(jié)點(diǎn)后的第一個(gè)節(jié)點(diǎn)
// insertBefore 第一個(gè)參數(shù)插入的節(jié)點(diǎn)對(duì)象杖狼，第二參數(shù)可選，在其之前插入子節(jié)點(diǎn)妖爷，如果不傳蝶涩，則在結(jié)尾插入。
parent.insertBefore(newNode, existingNode.nextSibling);
}
}
