appendChild添加节点的原理

来源：9-1 appendChild添加节点

且听风吟720

2019-07-11 15:23:11

<body>
    <ul id="box1">
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
    </ul>
    <script>
        window.onload=function(){
            var ul = document.getElementById('box1');
            var li = document.createElement('li');
            li.innerHTML='567';
            for(var i=1;i<=3;i++){
                ul.appendChild(li);
                console.log('append for once');//这里控制台输出了三遍，但是实际只添加了一个li
            }
        }
    </script>
</body>

想问一下，视频中说明了把父节点的第一个子节点传入appendChild方法后，子节点会移动到最后一个，而如果添加的节点始终是同一个节点，也只会添加一遍（如代码），这个原理是什么呢？

写回答

1回答