JS的基本DOM操作（增删改查）

### 查找 ###

（就是获取元素）

(1)，标准DOM API   

    document.getElementById(id);

    document.getElementsByTagName(name);

    document.getElementsByName(name);

    document.getElementsByClassName(names);

    document.querySelectorAll(selectors);

(2)，亲属访问

    parentNode     /*访问父节点*/
    parentElement  /*父元素*/

    childNodes  /*访问子节点*/
    children    /*子元素*/

---

//下面获取操作有IE8兼容问题

    firstChild  /*访问第一个子节点*/-------------IE8中获取到的是元素
    firstElementChild    /*第一个子元素*/-------------IE8不支持

    lastChild 或 childNodes[childNodes.length - 1]   /*访问最后一个子节点*/-------------IE8中获取到的是元素
    lastElementChild    /*最后一个子元素*/-------------IE8不支持

    previousSibling     /*访问上一个兄弟节点*/-------------IE8中获取到的是元素
    previousElementSibling    /*上一个兄弟元素*/-------------IE8不支持

    nextSibling     /*访问下一个兄弟节点*/-------------IE8中获取到的是元素
    nextElementSibling     /*下一个兄弟元素*/-------------IE8不支持

    attributes[0]     /*访问第一个属性节点*/

(3)，属性获取

    getAttribute(attributeName);

    getAttributeNode(attrName);

### 增加 ###

(1)，创建

    document.createElement(tagName);    /*元素节点*/
    document.createTextNode(data);    /*文本节点*/
    document.createAttribute(name);    /*属性节点*/
    cloneNode(deep)

(2)，加入

    document.write(markup) /*一般不用，文档加载完毕后使用会覆盖页面！*/

    appendChild(aChild)    /*追加到结尾处*/

    innerHTML

    innerText

    insertBefore(newElement, referenceElement)    
    /*用法----父元素.insertBefore(新元素, 旧元素)*/

(3)，其它

    style. 的操作

    setAttribute(name, value)

### 删除 ###

 删除元素

    removeChild(child)

    removeAttributeNode(attributeNode)

### 修改 ###

(1)，修改节点

    删除节点再加入

    replaceChild(newChild, oldChild)
    /*用法----父元素.replaceChild(新元素, 旧元素)*/

(2)，修改样式

    style.xxx = sss ;

    setAttribute(name, value)

(3)，修改文本

	innerHTML
	innerText
	
	nodeValue
	/*节点操作（删除旧文本节点再加入新文本节点）*/

(4)，修改属性

    setAttribute(name, value)

     . 属性名 = 值