JavaScript-DOM

DOM概念：

1. 是文档对象模型DOM（Document Object Modal）

当页面被加载时， 浏览器为页面生成DOM

被构造为对象的树（倒立的树）

2. 从编程角度看,DOM是针对HTML 和 XML的API(Application Programing Interface) 应用程序编程接口, 

js同过操作DOM可以实现添加，移出，修改页面元素 */

节点关系 ---dom节点的属性（用于遍历DOM节点， 找对应的DOM节点） 

childNodes: 所有子节点（含空格 回车 ，tab 等空白符 IE不包含上面）

children：所有元素子节点（不含文本节点）

parentNode： 父亲节点

firstChild：第一个子节点

lastChild： 最后一个子节点

nextSibling：下一个兄弟节点

previousSibling： 上一个兄弟节点 

* firstElementChild： 第一个元素子节点

* lastElementChild： 最后一个元素子节点

* nextElementSibling：下一个元素兄弟节点

* previousElementSibling：上一个元素兄弟节点

标签是一种节点类型

DOM里都叫节点 

节点里包含了 标签 注释 文本 doctype等在内的多种组合

1. 标签节点

2. 文本节点

3. 注释节点

通过nodeType 属性，能够知道节点类型是什么

nodeName, nodeValue

nodeName 属性规定了节点的名称

元素节点的nodeName与标签名相同，并且是大写的

文本节点的nodeName是 #text

nodeValue属性规定了节点的值

元素节点的nodeValue是空null或undefined

文本节点的nodeValue 是文本本身

属性节点的nodeValue 是属性值

节点操作， 调用dom给你提供的方法

增 （添加）首先createElement创建一个节点，然后再append一个节点，这样两步完成节点的添加

删 （移除）removeChild();

该 （替换）replaceChild();

查： document.getElementById

克隆：cloneNode(); 

createTextNode("字符串") 创建文本节点

createElement(“标签名) 创建新元素

appendChild(node): 向childNodes末尾插入一个节点node

insertBefore(目标节点node, targetNode) 向targetNode 前面添加node节点上去 

removeChild(node): 移除父节点的某个子节点 

replaceChild(newNode, oldNode);newNode 替换到 oldNode; 

cloneNode(布尔值)方法，可以创建指定的节点的精确拷贝，他能拷贝所有的属性和值，

如果参数是true，他将复制当前节点的所有子孙的节点，否则，它只复制当前节点。

DOM 的属性操作

1. setAttribute(name, value) 设置节点上name属性的值为value；

2. getAttribute(name) 获取节点上属性为name的值；

3. removeAttribute(name)移除节点上name属性的值