一些常用的Dom操作

Document.getElementByid("id名")
    通过id名获取元素节点
Document.getElementsByTagName('标签名')
    通过标签名获取元素集合
Document.getElementsByClassName()
    获取元素集合，返回一个包含了所有指定类名的子元素的类数组对象。
Document.getElementsByClassName()
    表单常用，通过表单的name名获取元素，返回类数组集合
Document.createElement(标签名)
    创建，增加元素节点
element.innerHTML
    替换元素的内容
Node.appendChild()
    拼接子节点，将一个节点附加到指定父节点的子节点列表的末尾处
Node.insertBefore(new,old)
    插入节点，将新节点插入旧节点之前
Element.setAttribute()
    直接设置属性值
    修改属性把指定属性设置或修改为指定得值,例如修改id，class，style
    可以设置自定义属性，但是通过点语法是不能调用的，要通过getAttribute("自定义属性名")获取
Element.getAttribute()
    获取属性
Element.getAttributeNode()
    获取属性节点
Node.cloneNode(deep) 
    克隆节点，方法返回调用该方法的节点的一个副本,
    deep：true 复制的话包含子节点，false 则不包含子节点

Node.removeChild()
    删除子节点
Node.removeAttributeNode()
    删除属性节点

Node.replaceChild()
    替换节点

Document.querySelector()
    通过CSS选择器获取元素，返回匹配元素
Document.querySelectorAll()
    通过CSS选择器获取元素，返回数组集合
    
Node.nextSibling
    获取下一个兄弟节点，如果指定的节点为最后一个节点，则返回 null。
    可以使用nodeType来查看节点类型
    nodeType返回值
        元素节点
        属性节点
        文本节点
        注释
NonDocumentTypeChildNode.nextElementSibling
    获取下一个兄弟接节点，忽略文档节点，只获取元素节点，如果指定的节点为最后一个节点，则返回 null。
Node.previousSibling
    获取上一个兄弟节点，没有则返回null
    其他同上
NonDocumentTypeChildNode。previousElementSibling
    获取上一个兄弟节点，忽略文档节点，只获取元素节点，没有则返回null

Node.firstChild
    获取第一个子节点，无子节点则返回null
Element.firstElementChild
    获取第一个子节点，无子节点则返回null
Node.lastChild
    获取最后一个子节点，没有则返回null
Element.lastElementChild
    获取最后一个子节点，没有则返回null
Node.childNodes
    获取子节点
Element.children
    获取子节点
Node.parentNode
    获取父级节点

Element.classList
    通过classList控制样式
    add(class1,class2,...) 添加类名
    remove(class1,class2,...) 删除类名
    replace(oldClass,newClass) 替换类名
    contains(class) 是否包含某个类名，返回布尔值