枯燥的js基本操作

增

document.createElement();//创建标签！！最常用的
document.createTextNode();//文本节点
document.createComment();//注释节点
document.createDocumentFragment();
*

插

PARENTNODE.appendChild();（约等于push）

 <div>

    </div>
    <script>
        var div = document.getElementsByTagName('div')[0];
        var text = document.createTextNode('123');
        var span = document.createElement('span');
        div.appendChild(span);
        div.appendChild(text);
    </script>

还可以交换标签顺序

<div>
        <span>123</span>
        <i></i>
        <b></b>
    </div>
    <script>
        var div = document.getElementsByTagName('div')[0];
        var i = document.getElementsByTagName('i')[0];
        var span = document.getElementsByTagName('span')[0];
        var b = document.getElementsByTagName('b')[0];
        div.appendChild(i);
        div.appendChild(span);

PARENTNODE.insertBefore(前，后);

var div = document.getElementsByTagName('div')[0];
        var text = document.createTextNode('123');
        var span = document.createElement('span');
        var strong = document.createElement('strong');
        div.appendChild(span);
        div.insertBefore(strong,span);

一定的注意前后顺序。

删

parent.removeChild();

child.remove();

替换

parent.replaceChild(new,origin);
一定是第一个新的，后面一个老的。

Element的属性

innerHTML

1.取出该元素

<div>
        <span>123</span>
    </div>
    <script>
        var div = document.getElementsByTagName('div')[0];
    </script>

2.覆盖内容。

可写入标签，写啥识别啥。

innerText

同样可以修改，但span会消失。

方法

setAttribute（‘id’,‘demo’）

setAttribute（‘id’）