手写js的insertAfter

最新推荐文章于 2022-11-09 21:15:32 发布

转载最新推荐文章于 2022-11-09 21:15:32 发布 · 80 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/wysAC666/p/9889179.html

本文介绍了一种在DOM中插入新元素并实现列表项下移的方法。通过JavaScript函数insertAfter()和down()，可以轻松地在指定元素后插入新元素或将当前列表项移动到下一个位置。此技术适用于网页动态更新和交互式列表操作。

function insertAfter(newElement, targetElement) {
        var parent = targetElement.parentNode;
        if(parent.lastChild == targetElement){
            parent.appendChild(newElement);
        }else{
            parent.insertBefore(newElement,targetElement.nextSibling);
        }
    }

还有这个下移的实现

function down(){
        var liCurrent = this.parentNode.parentNode;
        var next = liCurrent.nextSibling;
        while(next){
            if(next.nodeName == 'LI'){
                break;
            }
            next = next.nextSibling;
        }
        if(next) {
            insertAfter(liCurrent,next);
        } else {
            alert('已经是最后一个了');
        }
    }