深入学习js节点

　　DOM 模型(model)

　　HTML 文档中的所有节点组成了一个文档树模型，

　　HTML 文档中的每个元素、属性、文本等都代表着树中

　　的一个节点。这些节点相互联系，相互影响，构成一个

　　完整的页面，我们称之为模型。

　　HTML 文档中的每个成分都是一个节点。

　　? 整个文档是一个文档节点

　　? 每个 HTML 标签是一个元素节点

　　? 包含在 HTML 元素中的文本是文本节点

　　? 每一个 HTML 属性是一个属性节点

　　? 注释属于注释节点

　　节点的属性

　　节点属性能用来干什么?

　　1.通过节点的属性，能够获取到每个节点之间的关系，并且可以通过这种关系，

　　准确快速的获取到相应节点的对象。

　　获得节点关系的属性

　　对象.parentNode 获得父节点的引用

　　对象.childNodes 获得子节点的集合

　　对象.firstChild 获得第一个子节点的引用

　　对象.lastChild 获得最后一个子节点的引用

　　对象.nextSibling 获得下一个兄弟节点的引用

　　对象.previousSibling 获得上一个兄弟节点的引用

　　节点的方法

　　我们之前对页面元素的操作，都是在操作现有的元素，

　　那么我们如何动态的创建、删除、更改、复制元素，给

　　元素添加属性、样式呢?就就需要用到我们节点的方法。

　　节点的方法

　　一、创建节点

　　1>创建元素节点

　　document.createElement("元素标签名");

　　2>创建属性节点

　　对象.setAttribute(属性名,属性值)

　　3>创建文本节点

　　对象.innerHTML="";

　　document.createTextNode("文本");

　　节点的方法

　　二、追加到页面当中

　　父对象.appendChild(追加的对象)

　　在指定元素节点的最后一个子节点之后添加节点

　　父对象.insertBefore(要插入的对象,之前的对象) 插入

　　到某个对象之前

　　节点的方法

　　? 三、删除节点

　　? 父对象.removeChild(删除的对象)

　　? 如果确定要删除节点，最好也清空内存 对象=null;

　　节点的方法

　　三、修改(替换)节点

　　父对象.replaceChild(新节点,被修改的节点);

　　四、复制节点

　　待复制的节点.cloneNode() 方法创建指定节点的副本。

　　该方法有一个参数(true 或 false)。如果设置为true,

　　所有的子节点也会克隆，否则只会克隆本节点