JS自定义封装库之 DOM节点操作

最新推荐文章于 2022-11-06 14:03:53 发布

原创最新推荐文章于 2022-11-06 14:03:53 发布 · 530 阅读

0 ·

CC 4.0 BY-SA版权

JS兼容写法以及自定义封装函数库专栏收录该内容

5 篇文章

订阅专栏

本文介绍了一种在JavaScript中向指定节点后插入新节点的方法，通过检查目标节点的后续节点来决定是在目标节点后直接插入还是作为父节点的最后一个子节点。此技巧源自《JavaScript DOM编程艺术》，适用于网页开发中动态内容的高效更新。

1、向某节点后面插入节点

function insertAfter(newElement,targetElement){

    var parentElement=targetElement.parentNode;        //获取目标节点的父节点
    if(parentElement.lastChild == targetElement){
        parentElement.appendChild(newElement);
    }else{
        var next=targetElement.nextSibling;
        parentElement.insertBefore(newElement,next);    //在目标元素的下一个元素之前插入
    }
}

本代码示例摘自《JavaScript DOM 编程艺术》，在此记录，作为备忘。