节点添加(集合)

 

var li = document.createElement('li')

创建节点

 

ul.appendChild(li);

添加节点到末尾

 

ul.insertBefore(li, ul.children[0]);       // (要添加的节点,  添加到的位置)

添加节点到开头

 

代码示例 : 

    <ul>
        <li>123</li>
    </ul>
    <button>asdf</button>
    <script>
        // 1. 创建节点元素节点
        var li = document.createElement('li');
        // 2. 添加节点 node.appendChild(child)  node 父级  child 是子级 后面追加元素  类似于数组中的push
        var ul = document.querySelector('ul');
        ul.appendChild(li);
        // 3. 添加节点 node.insertBefore(child, 指定元素);
        var lili = document.createElement('li');
        ul.insertBefore(lili, ul.children[0]);
        // 4. 我们想要页面添加一个新的元素 ： 1. 创建元素 2. 添加元素
    </script>