JavaScript-172：创建和添加节点

结构

    <ul>
        <li>123</li>
        <li>545</li>
    </ul>
    <div>
        <span>11</span>
    </div>

JS

        // 1 createElement创建节点元素
        var li = document.createElement('li');
        var lili = document.createElement('li');
        // 添加节点 node.appendChild(child) node 父级 child是子级 后面追加元素 类似于数组中的push 在后面添加
        var ul = document.querySelector('ul');
        ul.appendChild(li);

        // 3 添加节点 node.insertBefore(child,指定元素)
        ul.insertBefore(lili, ul.children[0]);
        // 我们想要页面添加一个新的元素 ：  1 创建元素 2 添加元素