美文网首页
向容器中追加新元素的方法

向容器中追加新元素的方法

作者: gaoqizhuhui | 来源:发表于2017-08-06 20:48 被阅读0次

    向指定容器的末尾追加元素:append

    直接用appendChild也可以,写这个是为了与prepend对应

    function append(newEle,container){//两个参数分别是新元素和指定容器
         container.appendChild(newEle);
    }
    

    向指定容器的开头追加元素:prepend

    把新的元素添加到容器中第一个子元素节点的前面

    function prepend(newEle,container){
        var fir=firstChild(container);
        if(fir){
           container.insertBefore(newEle,fir);
           return;
        }
        container.appendChild(newEle);
    }
    

    向容器中指定元素的前面追加:insertBefore

    把新元素追加到指定元素的前面(不写这个方法也可以,为了对应而已)

    function insertBefore(newEle,oldEle){
         oldEle.parentNode.insertBefore(newEle,oldEle);
    }
    

    向容器中指定元素的末尾追加:insertAfter

    把新元素追加到指定元素的后面(相当于追加到oldEle弟弟元素的前面)

    function insertAfter(newEle,oldEle){
       var nex=next(oldEle);
       if(nex){
            oldEle.parentNode.insertBefore(newEle,nex);
            return;
       }
    //如果弟弟元素不存在,也就是当前元素已经是最后一个了,把新的元素放在最末尾即可
       oldEle.parentNode.appendChild(newEle);
    }
    

    相关文章

      网友评论

          本文标题:向容器中追加新元素的方法

          本文链接:https://www.haomeiwen.com/subject/xfdnlxtx.html