Dom基础

Dom基础

dom简介：

dom中文名称为文档对象模型，它是由w3c制定的标准。

Node类型：

node接口由所有的节点类型实现，其中有一些常用的属性也是所有的节点共有的如：nodeType:节点的类型，nodeName:文档名称，nodeValue:文档值

节点关系：

纵所周知文档整个就是一个树形的结构，理所当然其中的节点之间肯定会有着关系，这种关系由下列属性来维持着，childNodes：节点的所有子节点集合；(该集合是一个类数组集合而且是动态的集合)。访问其中的节点有几种方式，如：someNode.childNodes[0]或者someNode.childNodes.item(0);firstChild：获得某元素的第一个子节点；lastChild：获得某元素的最后一个子节点；previousSibling：获得某元素的前一个兄弟节点；nextSibling：获得某元素的后一个兄弟节点；parentNode：获得某元素的父亲节点。

操作节点：

appendChild(someNode)：用于向childNodes末尾添加节点,结果返回someNode;

insertBefore(newNode,someNode);将新节点插入childNodes中的特定位置，结果返回插入的节点，第一个参数是需要插入的节点，第二个参数是childNodes中的某个节点；

replaceChild(newNode,someNode);将childNodes中特定的节点换位新的节点，结果返回被换的节点即someNode;第一个参数为新节点，第二个参数为childNodes中的某个节点；

removeChild(someNode);移除childNodes中的某个节点，结果返回该节点；移除后从技术的角度看该节点还存在于文档中，但是此时它已经在文档中没有了自己的位置，下次垃圾回收时会将其回收掉(被替换掉的节点也是一样)。

上面这四个方法有一个共同的特点，那便是使用它们前必须获得父亲节点。也就是说是父亲节点在操作childNodes

cloneNode(boolean);boolean为true则为深复制，否则为浅复制

项目经验：前端开发过程中很多时间就是和文档在打交道，熟练的掌握这些基础知识讲给你带来很大的帮助